如何在輸入中預覽多個文件？

Question

我可以在input logos上選擇多個文件，我想預覽它的全部內容。目前我只能顯示其中的一個。

我不知道如何通過每個文件的循環使用此代碼：

 $(function() { 
     $("input[name='cover[logos][]']").on('change', function(event) { 
      var files = event.target.files; 
      for(i=0; i<files.length; i++){ 
       var image = files[i] 
       var reader = new FileReader(); 
       reader.onload = function(file) { 
        var img = new Image(); 
        img.src = file.target.result; 
        $('#target').html(img); 
        } 
       reader.readAsDataURL(image); 
      }; 
     }); 
    }); 

Answer 1

使用此

$('#target').append(img); 

代替

$('#target').html(img); 

對於更換圖像時用戶改變他的輸入

$('#target').html(''); 
for(i = 0; i < files.length; i++) { 
    //loop code 
} 

Fiddle

Answer 2

你的JS是罰款只是改變HTML追加

$('#target').append(img); 

，並使用

$('#target').html(''); 

清除先前選擇