Question

当我使用进度事件时，我可以更新一个上传请求的进度条：

function uploadFile(file) {
fileid=md5(file.name);
if {xhr[fileid] ;== undefined} {
        xhr[fileid] = new XMLHttpRequest();
        xhr[fileid].open('POST',' {% url upload %}', true);
        xhr[fileid].setRequestHeader("X-File-Name", file.name);
        xhr[fileid].setRequestHeader("X-File-id", fileid);
        xhr[fileid].upload.addEventListener('progress', onprogressHandler, false);
        xhr[fileid].upload.addEventListener('load',oncompleteHandler,false);
        xhr[fileid].send(file);
}

      function onprogressHandler(event) {
            var percent = event.loaded/event.total*100;
            var $target = $(event.target);
            console.log(uploadHolder[fileid]);
            uploadHolder[fileid].find(".upload-completed").css('width',percent+'%');
            console.log('Upload progress: ' + percent + '%');
        }

但是，当我同时发送超过2个文件的上传请求时，只会更改最后一个文件的进度条。如何确定事件附加到哪个文件上载请求？

更新：如果我将fileid声明为uploadFile的局部变量，如var fileid，我无法访问事件处理程序中的fileid。在事件处理程序中使用'this'给我XMLHttpRequestUpload对象。

Answer 1

你应该为javascript寻找“封闭”的概念。之后你会理解错误。我认为这个概念非常重要，你应该学习它：）

使用Html5上传多个文件的进度条

1 个答案: