Wie lege ich explizite Werte an Ort und Stelle innerhalb einer Callback-Funktion fest?

Question

Dieser Code funktioniert teilweise, verschiebt jedoch nur eine Fortschrittsleiste beim Hochladen mehrerer Dateien. Ich muss wissen, wie ich es mit mehreren XHR-Objekten und mehreren Fortschrittselementen arbeiten lassen kann.

var fileinput = document.getElementById('multiple_files_upload'); 
    var progressbars = document.getElementById('progressbars'); 
    //for every file... 
    for (var x = 0; x < fileinput.files.length; x++) { 

     // CREATING THE PROGRESSBAR   
     var newprg = document.createElement('progress'); 
     var divIdName = 'prg'+x; 
     newprg.setAttribute('id',divIdName); 
     newprg.className = "fileprogress"; 
     newprg.setAttribute('max',100); 
     newprg.setAttribute('value',0);   
     progressbars.appendChild(newprg); 

     // CREATING THE REQUEST FOR SUBMISSION 
     var newfd = new FormData(); 
     newfd.append('Filedata', fileinput.files[x]); 
     var xhr = new XMLHttpRequest(); 
     xhr.upload.onprogress = function(e) { 
      var percentComplete = e.position * 100/e.totalSize; 
      document.getElementById(divIdName).setAttribute('value',percentComplete); 
     } 
    xhr.open('POST', '<?php echo Yii::app()->CreateAbsoluteUrl('album/uploadifyphoto'); ?>', true); 
    xhr.send(newfd); // multipart/form-data 

    }  

Answer 1

ich denke, alles richtig zu sein scheint ... versuchen, eine größere Datei zu und den Fortschritt überprüfen ... einige Male, wenn Sie ein/mehrere kleine Dateien laden ... die Sendemethode sendet große Brocken von Bytes in einer einzigen Anfrage (es hängt auch von Ihrer Bandbreite ab) ... so dass die Onprogress-Methode einmal aufruft ... Sie müssen auch den Fortschritt nach Abschluss aller Dateien Upload

überprüfen