在動態創建的表上點擊功能

Question

我有一個表，它動態創建。當我點擊圖像，然後我需要刪除錶行。在這裏點擊功能不工作。

動態創建表。

row.append($("<td id="imageclose"><p>" + '<img src="' + '/Content/Images/crossimg.png' + '" width:"225px" height:"225px" />' + "</p></td>")); 

點擊功能

$("#imgclose").click(function() { 
    alert("asdfg"); 
}); 

Answer 1

使用類imageclose，而不是像id以下。因爲id應該對每個元素都是唯一的。

row.append($("<td class="imageclose"><p>" + '<img src="' + '/Content/Images/crossimg.png' + '" width:"225px" height:"225px" />' + "</p></td>")); 

對於動態生成的元素，您需要事件delegation。

$('body').on('click', '.imgclose img', function() { 
    $(this).closest('tr').remove(); 
}); 

Answer 2

您不能使用'ID'，因爲它應該是唯一的。所以不要使用類的ID來完成你的任務。

第一路與onclick調用函數。

row.append($("<td><p>" + '<img src="' + '/Content/Images/crossimg.png' + '" width:"225px" height:"225px" onclick="abc()" />' + "</p></td>")); 

function abc() { 
    $(this).closest('tr').remove(); 
} 

方式二與類屬性。

row.append($("<td><p>" + '<img class="myclass" src="' + '/Content/Images/crossimg.png' + '" width:"225px" height:"225px" />' + "</p></td>")); 

$('#tableId').on('click', '.myclass', function() { 
    $(this).closest('tr').remove(); 
});