Question

我需要使用jquery在多个文件输入中获取每个文件的内容，并根据我需要在页面中进行一些修改的文件内容。这是我写的代码来做同样的事情。这里发生了什么是如果我选择3个文件我只获得第3个文件的内容。如果我使用索引号而不是循环我能够获取内容但是如果我使用循环我将获得最后的文件内容。有人可以解释我的错吗？

<input type="file" name="xsd" id="xsd" multiple="multiple">

     $('#xsd').change(function(){  

        input = document.getElementById('xsd');
        for(var i = 0; i < input.files.length ; i++)
        {
        file = input.files[i];
        fr = new FileReader();
        fr.readAsText(file);
        fr.onload = function(e) {
            var filecontent = fr.result;
            // My logic here
        } 
       }
    });

Answer 1

您的问题是 onload 功能正在使用它＆＃34; fr＆＃34;来自a closure。

您可以使用immediately-invoked anonymous function这样为每个onload-callback创建一个单独的闭包：

$('#file').change(function(){  

    input = document.getElementById('file');
    for(var i = 0; i < input.files.length ; i++)
    {
        (function(i) {
            var file = input.files[i];
            var fr = new FileReader();
            fr.onload = function(e) {
                var filecontent = fr.result;
                // My logic here
            }
            fr.readAsText(file);
        })(i);
   }
});

使用jquery在多个文件输入中获取每个文件的内容

1 个答案: