多個文件上傳成功後刪除（）圖像

Question

我試圖讓我所有的預覽圖像對.remove（）成功，並想知道我會如何做到這一點。

發生了什麼 - 如果說我上傳的兩張圖片。只有兩個圖像中的一個將刪除（）上的成功;如果我上傳三張圖片然後上傳圖片，三張圖片的兩張預覽仍然存在。所以它只能刪除一個預覽圖像。我相信這是最後插入的預覽圖像。

這是我所擁有的。

//functions on change event of file input to select different file 
    $('body').on('change', '#image_data', function(){ 
       if (this.files && this.files[0]) { 
        abc += 1; //increementing global variable by 1 

        var z = abc - 1; 
        var x = $(this).parent().find('#previewimg' + z).remove(); 
        $(this).before("<div id='abcd"+ abc +"' class='abcd'><img id='previewimg" + abc + "' src=''/></div>"); 

        var reader = new FileReader(); 
        reader.onload = imageIsLoaded; 
        reader.readAsDataURL(this.files[0]); 

        })); 
       } 
      }); 

//To preview image  
    function imageIsLoaded(e) { 
     $('#previewimg' + abc).attr('src', e.target.result); 
    }; 

成功

success: function(data) 
{ 
$("#previewimg" + abc).remove(); 
} 

Answer 1

當你被IDS所有人都沒有得到一次在去除下來。 如果要一次刪除所有圖像，可以使用類而不是Ids。

//functions on change event of file input to select different file 
$('body').on('change', '#image_data', function(){ 
      if (this.files && this.files[0]) { 
       abc += 1; //increementing global variable by 1 

       var z = abc - 1; 
       var x = $(this).parent().find('#previewimg' + z).remove(); 
       $(this).before("<div id='abcd"+ abc +"' class='abcd'><img id='previewimg" + abc + "' src='' class='previewImages'/></div>"); 

       var reader = new FileReader(); 
       reader.onload = imageIsLoaded; 
       reader.readAsDataURL(this.files[0]); 

       })); 
      } 
     }); 

//To preview image  
    function imageIsLoaded(e) { 
     $('#previewimg' + abc).attr('src', e.target.result); 
}; 

在成功：

success: function(data) 
{ 
    $(".previewImages").remove(); 
}