jquery從陣列中刪除對象使用html5進行圖像預覽

Question

我成功地將預覽圖像從查看區域中移除，但實際上並沒有將它從陣列中刪除。我無法弄清楚如何刪除它，因爲它從未被選中，請幫助我！

http://jsfiddle.net/ERZVC/

var count=0; 
function handleFileSelect(evt) { 
    var $fileUpload = $("input#files[type='file']"); 
    count=count+parseInt($fileUpload.get(0).files.length); 

    if (parseInt($fileUpload.get(0).files.length) > 6 || count>5) { 
     alert("You can only upload a maximum of 5 files"); 
     count=count-parseInt($fileUpload.get(0).files.length); 
     evt.preventDefault(); 
     evt.stopPropagation(); 
     return false; 
    } 
    var files = evt.target.files; 
    for (var i = 0, f; f = files[i]; i++) { 
     if (!f.type.match('image.*')) { 
      continue; 
     } 
     var reader = new FileReader(); 

     reader.onload = (function (theFile) { 
      return function (e) { 
       var span = document.createElement('span'); 
       span.innerHTML = ['<img class="thumb" src="', e.target.result, '" title="', escape(theFile.name), '"/><span class="remove_img_preview"></span>'].join(''); 
       document.getElementById('list').insertBefore(span, null); 
      }; 
     })(f); 

     reader.readAsDataURL(f); 
    } 
} 

$('#files').change(function(evt){ 
    handleFileSelect(evt); 
}); 

$('#list').on('click', '.remove_img_preview',function() { 
    $(this).parent('span').remove(); 
}); 

HTML

<input type="file" id="files" name="image_file_arr[]" multiple> 
<br><output id="list"></output> 

Answer 1

這裏被更新fiddle。

唯一的錯誤是你沒有減少計數器在刪除文件。

謝謝。

var count=0; 
function handleFileSelect(evt) { 
    var $fileUpload = $("input#files[type='file']"); 
    count=count+parseInt($fileUpload.get(0).files.length); 

    if (parseInt($fileUpload.get(0).files.length) > 6 || count>5) { 
     alert("You can only upload a maximum of 5 files"); 
     count=count-parseInt($fileUpload.get(0).files.length); 
     evt.preventDefault(); 
     evt.stopPropagation(); 
     return false; 
    } 
    var files = evt.target.files; 
    for (var i = 0, f; f = files[i]; i++) { 
     if (!f.type.match('image.*')) { 
      continue; 
     } 
     var reader = new FileReader(); 

     reader.onload = (function (theFile) { 
      return function (e) { 
       var span = document.createElement('span'); 
       span.innerHTML = ['<img class="thumb" src="', e.target.result, '" title="', escape(theFile.name), '"/><span class="remove_img_preview"></span>'].join(''); 
       document.getElementById('list').insertBefore(span, null); 
      }; 
     })(f); 

     reader.readAsDataURL(f); 
    } 
} 

$('#files').change(function(evt){ 
    handleFileSelect(evt); 
}); 

$('#list').on('click', '.remove_img_preview',function() { 
    $(this).parent('span').remove(); 
    count--; 
}); 

[即是從與jquery數組中刪除清除圖像預覽文件（的