4

我正在通过 ajax 上传文件并在上传后处理图像。当我尝试在 firefox 上通过 ajax 上传图像文件时，当上传百分比为 100% 但文件上传成功时，xhr 进度事件不会触发我的进度功能。

上传进度 100% 时谷歌浏览器触发，但火狐没有。

Biriefly 我的上传脚本：

$("#uploadbutton").click(function(){
   var xhr=new XMLHttpRequest()
   ,fd=new FormData();

   xhr.upload.addEventListener("loadstart", uploadStart, false);
   xhr.upload.addEventListener("progress", uploadProgress, false);
   xhr.addEventListener("error", uploadFailed, false);

   xhr.open("POST", mainurl+"ajaxupload.php");

   $.each($("#upload_input").files,function(i,file){
     fd.append("files_"+i,file);
   });    

  xhr.send(fd);

});

function uploadProgress(event){
   var percentComplete = Math.round(event.loaded * 100 / event.total);
   console.log("pecent ",percentComplete);
}

上传开始时，uploadProgress 函数运行 1 次（大部分在上传百分比 80% 时），但在上传完成时不触发。

4

1 回答 1

2

除了您当前的处理程序之外，还要添加两个：load（如果成功完成则触发），loadend（最后触发，始终）。

// zero or once
xhr.addEventListener("load", uploadSuccess, false);
function uploadSuccess(event) {
    console.log("Upload successful.");
}

// once
xhr.addEventListener("loadend", uploadComplete, false);
function uploadComplete(event) {
    console.log("All done.");
}
于 2012-09-05T01:00:20.463 回答