Question

我写了一个简单的代码来删除表上的记录，

<td><a href = "#" class = "delete">Delete</a></td>

$('.delete').on('click', function() { 
     console.log('try');
});

问题在于，如果文件中有多少td，如果有10个td's有删除类，则会将try条纹记录10次。

我是否使用on click事件监听器错误或者这是jquery上的问题。谢谢。

Answer 1

对.on()的单次调用只会导致启动单个事件处理程序。

恕我直言，对你的错误最可能的解释是你实际上多次调用.on() - 也许是在创建<td>元素的循环中？

在单个处理程序中，您可以使用DOM遍历来标识单击了哪个列或元素，并相应地执行操作。例如，如果您想删除当前行，可以使用它：

for (...) {
    // populate the table here
}

// handler will remove the row containing the clicked ".delete" link
$('.delete').on('click', function() {
    $(this).closest('tr').remove();
});

编辑根据来自OP的新信息，问题实际上是每次添加一行时反复重复注册同一个处理程序。

在这种情况下，最好的解决方案是事件委派，您将处理程序放在表上（只需一次），而不是单个元素：

$('#mytable').on('click', '.delete', function() {
    // do your delete stuff here
});

请注意.delete的附加.on参数 - 这告诉jQuery您感兴趣的表格中的哪些特定元素 - 点击的元素将作为this传递。

您可以在表格填充之前进行此调用，它可以在表格中找到的任何.delete元素上运行，即使是稍后添加的，也是动态的。

在jquery中单击事件侦听器

1 个答案: