Question

我正在使用XMLHttpRequest同时上传多个文件。我希望每个文件都有自己的进度指示器。因此，当我获取要上传的文件数组时，我会在

之类的循环内启动每个文件的上传

for(var i=0; i<files.length; i++)                    
{
  // Create transfer object
  var xhr = new XMLHttpRequest();

  // Attach progress event handler
  xhr.addEventListener('progress', function(e) { showProgress .... });

 ....
}

问题是，如何传递正确的＆＃34; i＆＃34;值为进度回调函数。如果我使用＆＃34; i＆＃34;像这样：

  xhr.addEventListener('progress', function(e) { console.log(i); });

我总是得到最新的＆＃34;我＆＃34;值。如果这样定义：

  xhr.addEventListener('progress', (function(i,e) { console.log(i); })(i));

我说得对，但我从来没有得到过事件对象，所以我没有得到实际的进展。什么是正确的定义方式？

Answer 1

使用xhr.upload.progress代替xhr.progress。

创建IIFE，将i传递给IIFE，创建新的progress元素className "progress-"并i连接，更新当前进度元素{{1在.value e.loaded事件中{}} {}另请参阅Upload multiple image using AJAX, PHP and jQuery

upload

jsfiddle https://jsfiddle.net/ytedpcro/1/

如何使用Javascript将循环变量传递给事件回调函数

1 个答案: