预览从输入文件SOLVE中选择的文件

Question

我有下一个代码：

            function PreviewImage() {
            var oFReader = new FileReader();
            var documentos = document.getElementById("uploadImage");
            var tamanio = documentos.files.length;
            for (var i = 0; i < tamanio; i++) {
                document.write("-"+i);
                oFReader = new FileReader();
                oFReader.readAsDataURL(documentos.files[i]);
                oFReader.onload = function(event) {
                    document.write("+"+i);
                    document.getElementById("uploadPreview"+i).src = event.target.result;
                };                   
            }          
        }

这将从输入uploadImage中读取文件。我想在id =“uploadPreviewX”的标签上预览图像。当我不使用for循环时它很好用。我打印“i”进行测试，第一印象是正确的：-0-1-2 - ... - （tamanio-1），问题是第二个，然后打印tamanio tamanio次。例如，如果选择4个文件，则输出为：-0-1-2-3 +4 +4 +4 +4。因此我只能预览id = uploadPreview4的img。 我做错了什么？

UPDATE SOLVE 在阅读了一些关于循环内部Javascript闭包的文档后......我可以做到。

• JavaScript closure inside loops – simple practical example

• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Closures

  function PreviewImage() { var funcs = []; var documentos = document.getElementById("uploadImage"); var tamanio = documentos.files.length; for (var i = 0; i < tamanio; i++) { funcs[i] = (function(index) { return function(event) { document.getElementById("uploadPreview" + index).src = event.target.result; }; })(i); } var oFReader = new FileReader(); for (var k = 0; k < tamanio; k++) { oFReader = new FileReader(); oFReader.readAsDataURL(documentos.files[k]); oFReader.onload = funcs[k];
}
}

谢谢