jQuery的循環

Question

我需要循環這對多文件輸入：

var reader = new FileReader(); 

    reader.onload = function (e) { 
     $('#pprev_0') 
     .attr('src', e.target.result); 
    }; 

    reader.readAsDataURL(input.files[0]); 

我嘗試這樣做，但它不工作：

var fileCount = 0; 
$("input[name='files[]']").each(function() { 

    var reader = new FileReader(); 

    reader.onload = function (e) { 
     $('#pprev_'+fileCount) 
     .attr('src', e.target.result) 
     .css("display","block"); 
    }; 

    reader.readAsDataURL(input.files[fileCount]); 

    fileCount++; 
}); 

上fileCount警報（）在多個文件選擇上輸出是一次性的0。沒有更多的警報。如果我用代碼中的數字代替fileCount var，它可以在位置上工作。 R.G. input.files [2] ...

任何想法？

Answer 1

當你這樣做：$("input[name='files[]']").each(function() {你實際上得到任何匹配選擇器的元素。在這種情況下，你得到你的單個多文件輸入（這就是爲什麼你只看到1個警報，你想要做的是迭代文件，

這個頁面有代碼來做你想要的東西。建議你檢查出來：

http://www.html5rocks.com/en/tutorials/file/dndfiles/

將它應用到你的情況，你會做這樣的事情：

var files = $('#files')[0].files; //where files would be the id of your multi file input 
//or use document.getElementById('files').files; 

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

    var reader = new FileReader(); 

    reader.onload = function (e) { 
     $('#pprev_'+fileCount) 
     .attr('src', e.target.result) 
     .css("display","block"); 
    }; 

    reader.readAsDataURL(f); 

}