0

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

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

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

问题是,如果文档上有多少个 td,我的意思是如果有 10 个td's具有删除类,它try也会记录 10 次字符串。

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

4

1 回答 1

3

一次调用.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在表格中找到的任何元素上工作,即使是以后添加的元素,也是动态的。

于 2013-10-22T09:40:04.060 回答