FileReader 在删除多个文件时只读取一个文件

Question

我正在编写代码，正在努力阅读每个文件。我得到的是只有一个文件正在读取。

下面的代码会记录每次迭代 (console.log(i))，但只会读取和记录最后一个文件，无论是读取为 dataURL 还是读取为 Text

fileInput.on('change',function(){

    var files= fileInput.prop('files');
    console.log(files);

    for(var i = 0; i < files.length; i++){

       var reader = new FileReader();
      console.log(i);
      reader.onload = function(){

          console.log(reader.result);
      }
      reader.readAsDataURL(files[i]);

    }

  });

我需要将多个文件中的每一个都记录到控制台中。提前致谢

Answer 1

使用 let 而不是 var 来将变量正确地限定在循环中：

for (let i = 0; i < files.length; i++) { // Use let here

  var reader = new FileReader();
  console.log(i);
  reader.onload = function() {

    console.log(reader.result);
  }
  reader.readAsDataURL(files[i]);

}

Answer 2

你是不是忘记了 input 元素的 multiple 属性？

Answer 3

对于 reader 变量，您应该使用 let 而不是 var，因为 var 是函数范围的。

FileReader 在删除多个文件时只读取一个文件

FileReader reads only one file when multiple dropped

javascript

file

reader