2012-04-02 59 views
0

此代码部分工作,但只上传多个文件时仅向前移动一个进度条。我需要知道如何使它能够与多个XHR对象和多个进度元素一起工作。如何在回调函数中当场指定显式值?

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 

    }  

回答

0

我觉得一切似乎是正确的......尽量上传较大文件,并检查进度......有些时候,如果你上传一个/多个小文件...发送方法将发送大大量的字节在一个单一的请求(这也取决于你的带宽)...所以进展方法调用一次...你还需要检查所有文件上传完成的进度

相关问题