一个XMLHttpRequest的多个进度条状态

如何解决一个XMLHttpRequest的多个进度条状态

尝试通过一个XMLHttpRequest获取多进度条状态，并上传多文件。无法使用jQuery，由于客户端的限制，我没有选择遍历文件的权限，并且无法在循环中使用new XMLHttpRequests。

目前，我可以为所有文件合并一个进度条。我需要的是多个进度条百分比。如果我在fileObj循环中执行request.upload.onprogress，则只会更新最后一个进度条。

let formData = new FormData(); 
let request = new XMLHttpRequest();
request.open('POST',postUrl);

for( var x in fileObj){
    formData.append("file",fileObj[x]);

    //this is where I tried to put the request.upload.onprogress with dynamic ids but Failed.
}

request.upload.onprogress = function (e) {
    if (e.lengthComputable) {
    var percentComplete = (e.loaded / e.total) * 100;
    d.getElementById("progress-bar" ).style.width = percentComplete + "%";
    d.getElementById('progress-bar-output').innerHTML = Math.round(percentComplete) + "%";              
    }
};

request.onload = function (e) {
    console.log( JSON.parse( e.target.response ) );
};

request.send(formData);

解决方法

如果git是fileObj对象，则可以执行以下操作

FileList