Html5 слушатель прогресса загрузки ajax-файла не запускается при загрузке 100% на Firefox - PullRequest
Новая
       27

Html5 слушатель прогресса загрузки ajax-файла не запускается при загрузке 100% на Firefox

4 голосов
/ 09 февраля 2012

Я загружаю файлы через ajax и обрабатываю изображения после загрузки.Когда я пытался загрузить файлы изображений через ajax в Firefox, событие xhr не вызывало мою функцию прогресса, когда процент загрузки выполнялся на 100%, но файл загружался успешно.

Google Chrome срабатывает, когда прогресс загрузки 100%, а Firefox этого не делает.

Вкратце мой сценарий загрузки: 

$("#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%), но не запускается при загрузке fnish.

1 Ответ

2 голосов
/ 05 сентября 2012

В дополнение к вашим текущим обработчикам, добавьте еще два: 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.");
}
...