Question

我正在修改一个片段，该片段是使用JS调整JPEG大小时发现的。一切都在使用调整大小位，但是我在多个文件输入字段中使用它，并且FileReader组件似乎与遍历输入选择字段中每个文件的for循环搞砸了。

这是我的代码，稍作修改以删除不相关的内容。基本上，在遍历文件时，我可以轻松地看到“ i”增量/计数器值，但从reader.onloadend函数内部的*除外。由于某些原因，此函数始终显示文件总数或最终计数器...，无论它在循环中的位置。因此，如果我在此函数之外对i发出警报，则会得到正确的值，但是如果输入字段中的文件总数为4，则在其中将返回4。

请注意，在下面的示例中，我尝试声明一个全局变量fid，然后在循环中将其设置为i的值……但这也不起作用。

var fid;

function handleFileSelect(evt) {
var files = evt.target.files;
$(".images").show();

for (var i = 0, f; f = files[i]; i++){

    var initialSize = files[i].size;
    var orgFile = files[i];
    fid = i;

    var reader = new FileReader();
    reader.onloadend = function(e){
        MinifyJpegAsync.minify(e.target.result, 1280, function post(data) {
            var formData = new FormData();
            var array = [];
            for (var p=0; p<data.length; p++) {
                array[p] = data.charCodeAt(p);
            }
            var photo = new Blob([new Uint8Array(array)], {type: 'image/jpeg'});


            formData.append('file', photo);

            var request = new XMLHttpRequest();
            request.onreadystatechange = function() {
                if (request.readyState === 4) {
                    alert("File #"+fid+" status"+.request.response);
                }
            }

            request.open("POST", "/upload");
            request.send(formData);
        });
    };
    reader.readAsDataURL(f);
}
}

document.getElementById('file').addEventListener('change', handleFileSelect, false);

Javascript循环和FileReader

0 个答案: