jquery datatables使用实时函数多次调用事件处理程序

时间:2012-10-06 00:28:26

标签: javascript jquery javascript-events event-handling datatables

我正在使用jquery数据表来显示一些数据。每行都有一个编辑按钮,我使用live()注册一个点击处理程序,以便它与分页一起使用。我是按类进行的,因为我必须每行都这样做。 就像是: Datatables with live click event function

这很好用。但问题发生在用户再次进行搜索并且我执行ajax请求以获取一组新结果时。

我只是用一个新的替换dom中的现有表。现在当我点击第1行时,它会弹出第1行的编辑对话框。我点击第2行,弹出第1行的编辑对话框。我再次点击第2行,这次会弹出第2行的编辑对话框。

然后我一次又一次点击第3行。它会在第3行的对话框显示第3行的对话框之前弹出第2行的编辑对话框。

这种情况在不断增加。我不明白我是否用jquery替换div中的整个dataTable为什么要注册多个事件?

如果重要,我在对话框初始化程序中将autoopen设置为false,然后我明确地打开并关闭它。

修改(更多详情)

我很难创建一个示例......但更多细节...我发现由于我使用live()函数来跨分页注册调用,因此存在点击注册机制。因此,当我用相同的结构替换表时,由于第一次调用live(),因此注册了click函数。但我默认再次调用live(),现在注册了两个点击事件。然后当我再次更换时,注册了三个事件点击。我通过在检查点击事件是否已经注册后使用jquery click()注册事件来尝试克服这个问题。帮助处理多个事件部分,但不会跨数据表页面注册事件。

2 个答案:

答案 0 :(得分:0)

有live和ajax这个问题。我最近做的是在收到ajax响应后重新注册事件点击。没有示例,很难推荐解决方案,但想法是使用绑定/单击(对于默认/初始显示)在页面加载上附加单击事件,然后在成功的ajax响应上再次重新注册单击事件。当然,将事件绑定代码放在可重用的组件(如函数)中,以便可以轻松调用它。

答案 1 :(得分:0)

解决了问题

问题是我无法在数据表行中的元素上注册click事件。事件不会在数据表页面中注册。

使用live()注册帮助和页面更改的事件将自动注册事件。

但是对于我每次进行搜索时导致另一个问题的用例,我会用新的替换数据表。新数据表将再次注册这些事件。这意味着为同一个元素调用多个处理程序。因为live()函数在同一个类上被调用了两次,并且jquery不会比较两个回调处理程序是否相同。

我转向了另一个方向,尝试使用.click()代替.live()使用页面事件(http://datatables.net/docs/DataTables/1.9.beta.1/#page_details)注册点击事件。这没有帮助,因为在使用新页面上的事件刷新内容之前调用了页面更改事件。

我还尝试使用click()而不是live()和绑定点击,如果它尚未使用此处给出的示例https://stackoverflow.com/a/6361507/161628进行注册。 这种技术适用于表替换,但不适用于多个页面。

最终我找到了.die()函数。我在调用live()函数之前调用它。对live()的调用确保事件处理程序在页面更改时注册,而对die()的调用确保我取消注册之前在该类元素上生成的live()事件。我以这种方式避免多次调用live()函数。