如何刪除文件名而不是所有文件名？

Question

我在刪除文件時遇到了問題。我有一個應用程序[這裏] [1]。

要使用該應用程序，點擊「添加」按鈕，將出現一個包含文件輸入的表格行。請使用文件輸入上傳幾個小文件，然後點擊「上傳」按鈕。現在你意識到當你上傳一個文件的時候，文件的名字出現在表格的下面，每個文件名都包含它自己的「刪除」按鈕。

現在問題是讓我們說你想刪除一個文件名，當你點擊「刪除」按鈕時，它將刪除所有不正確的文件名。它只應刪除您想要刪除的文件名。如果您嘗試上傳另一個文件，同樣在刪除文件名後，文件名不會顯示在下面。

所以我的問題是，什麼是我應該這樣做的正確方法，以便當用戶刪除文件名時，它只刪除它關聯的文件名，而不是所有文件名？在用戶上傳其他文件後刪除文件名後，應顯示該文件的文件名。

下面是代碼，其中文件名，刪除按鈕和水平線被附加在：

<ul class='listImage' align='left'> 

下面是JavaScript代碼：

function stopImageUpload(success, imagefilename){ 

     var result = ''; 

     if (success == 1){ 
     result = '<span class="msg">The file was uploaded successfully!</span><br/><br/>';  
     $('.listImage').append(htmlEncode(imagefilename) + '<button type="button" name="deletefileimage" class="deletefileimage">Delete</button><br/><hr/>'); 
     } 
     else { 
     result = '<span class="emsg">There was an error during file upload!</span><br/><br/>'; 
     } 

      $(".deletefileimage").on("click", function(event) { 

     $(this).parents("form:first").find(".listImage").replaceWith(""); 

    }); 

     return true; 
} 

Answer 1

你應該做的是包裝每個文件/ deletebutton在他們自己的div和刪除該div當用戶presse刪除。

$('.listImage').append('<div>' + htmlEncode(imagefilename) + '<button type="button" name="deletefileimage" class="deletefileimage">Delete</button><br/><hr/><div>'); 

並且在Click事件

$(this).parent().remove(); 

Answer 2

嘗試：

$(".deletefileimage").on("click", function(event) { 
     $(this).closest(".listImage").remove(); 
    });