如何使用jquery从动态生成表中删除行?
问题描述:
我的代码使用jquery动态创建表。我想在表中添加删除功能。因此,当点击删除图像时,该行应该被删除。但是当表是静态的时,删除工作正常。
这里是我的代码:
My code creates dynamically a table using jquery. I want to add delete functionality to the table. So when clicking on delete image the row should be delete. But deleting works fine just when the table is static. here id my code:
createTable: function () {
var lastRow = $('#TblInvoiceList tr:last');
var newRow = $('<tr>');
newRow.append($('<td>').text($('input.Name').val()), $('<td>').text($('input.GrossAmount').val()));
newRow.append("<td class='center'><img class='ImgDelete' src='image/ButtonDelete.png' /></td>");
lastRow.before(newRow);}
这是删除功能:
$('#TblInvoiceList td img.ImgDelete').click(function () {
alert("hi");
$(this).parent().parent().remove();
});
答
使用委托比动态添加内容更高效执行:
Use delegate even more efficient than live for dynamic added content do:
$('#TblInvoiceList').delegate('img.ImgDelete', 'click', function(e) {
alert("hi");
$(this).parent().parent().remove();
});