Javascript 无法通过XMLHttpRequest对象上载文件，但上载状态已更改

我想在Codeigniter应用程序中上传一个文件。我正在使用

XMLHttpRequest

对象上载文件并更新进度条以显示文件的上载状态。问题是文件未上载，但进度条显示从0%到100%的进度。您可以在下面找到我的代码：

视图：

---

这并不能真正回答你的问题，但它是一个解决方案。我使用JqueryForm（）来管理我的上传。在所有浏览器和管理器中都能很好地工作well@QBM5-你能告诉我如何使用上面的代码吗？不，这就是为什么我说这不是一个真正的答案，只是一个建议。网站上有很好的文档

<script>
  function upload_video_Data(a) {      
    var fd = new FormData(document.getElementById('posting_comment_'+a)[0]);
    fd.append("file_m_id",a);
    var bar = $('.bar');
    var xhr = new XMLHttpRequest();        
    xhr.upload.addEventListener("progress", uploadProgress, false);

    xhr.open("POST", "dashboard/do_upload_video");
    xhr.send(fd);  

    function uploadProgress(evt) {
      if (evt.lengthComputable) {
        var percentComplete = Math.round(evt.loaded * 100 / evt.total);
        document.getElementById('progressNumber_'+a).innerHTML = percentComplete.toString() + '%';
        $("#status_"+a).animate( { width: percentComplete.toString()+"%"}, 5);
      }   
    }

    setTimeout(function(){ remove_video_progress_bar(a); }, 1000);       
  }
</script>

<form name="posting_comment" id="posting_comment_<?=$row1['id']?>" method="post">
  <span style="margin-left: 8px;" id="video_<?=$row1['id']?>" >
    <input type="file" name="save_movie_<?=$row1['id']?>" class="movie_field" id="movie_<?=$row1['id']?>" /> 
    <input type="hidden" name="form_id" value="<?=$row1['id']?>"/> 
  </span>   
  <input type="button" class="postbtn" id="submit_movie_<?=$row1['id']?>" value="Upload Video File" onclick = "return upload_video_Data(<?=$row1['id']?>)"/> 

  <div id="progress_video_<?=$row1['id']?>" style="background:transparent;border:none;"> 

    <div class="progress" style="background: transparent;border:none;">
      <div id="status_<?=$row1['id']?>" style="background:#0066cc; width:0%;"></div>
      <div id="progressNumber_<?=$row1['id']?>" class="percent" style="background: transparent;border:none;color:blue;">0%</div>
    </div>
  </div>
  <div style="background-color: transparent;border:none;" id="ext_error_<?=$row1['id']?>"> </div>  
</form>

public function do_upload_video($a) {    
  $lecture_id=$this->input->post('form_id');
  $output_dir = "./uploads/";
  $type="video";

  $fileName = $_FILES["save_movie_".$lecture_id]["name"];
  $extn = pathinfo($fileName, PATHINFO_EXTENSION);

  if(!move_uploaded_file($_FILES["save_movie_".$lecture_id]["tmp_name"],$output_dir.$fileName)) {
  } else {        
  }   
}