FileReader onload with result和parameter [英] FileReader onload with result and parameter

问题描述

我无法同时获得文件阅读器的结果和onload函数中的一些参数。这是我的代码：

I can't manage to get both the result of the filereader and some parameters in a onload function. This is my code:

控制HTML：

<input type="file" id="files_input" multiple/>

Javascript函数：

Javascript function:

function openFiles(evt){
    var files = evt.target.files;
    for (var i = 0; i < files.length; i++) {
      var file=files[i];
      reader = new FileReader();
      reader.onload = function(){
          var data = $.csv.toArrays(this.result,{separator:'\t'});
      };
      reader.readAsText(file);
    }
  }

添加活动：

 files_input.addEventListener("change", openFiles, false);

我使用 filereader.result ， onload 函数。如果我为这个函数使用参数，比如file，我就不能再访问结果了。例如，我想在onload函数中使用 file.name 。如何解决这个问题？

I use the filereader.result, in the onload function. If I use a parameter, like file, for this function, I can't not access to the result anymore. For example I'd like to use file.name in the onload function. How to resolve this issue ?

推荐答案

尝试将onload函数包装在另一个函数中。在这里，闭包允许您通过变量 f 来访问正在处理的每个文件：

Try wrapping your onload function in another function. Here the closure gives you access to each file being processed in turn via the variable f:

function openFiles(evt){
    var files = evt.target.files;

    for (var i = 0, len = files.length; i < len; i++) {
        var file = files[i];

        var reader = new FileReader();

        reader.onload = (function(f) {
            return function(e) {
                // Here you can use `e.target.result` or `this.result`
                // and `f.name`.
            };
        })(file);

        reader.readAsText(file);
    }
}

有关为什么需要关闭的讨论，请参阅这些相关问题：

For a discussion of why a closure is required here see these related questions:

• 循环内的JavaScript闭包 - 简单的实际示例


• Javascript臭名昭着的循环问题？

• JavaScript closure inside loops – simple practical example
• Javascript infamous Loop issue?

这篇关于FileReader onload with result和parameter的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！