使用分页时只有表格的第一页是可点击的 - List.js答案

【问题标题】：Only first page of table is clickable when using pagination - List.js使用分页时只有表格的第一页是可点击的 - List.js
【发布时间】：2015-07-20 23:29:58
【问题描述】：

我正在对包含超过 200 行的表使用 list.js 搜索和分页。我有一个单击事件，如果单击一行并显示一个模式，则会触发该事件。问题是这个点击事件只在分页时针对表格第一页上的行触发。

    var testList = new List('test-list', {
    valueNames: ['division', 'region', 'location', 'name'],
    page: 10000,
    plugins: [ListPagination({})]
    });

当我将页面限制设置为 10000 时，我可以单击所有行，因为它们位于第一页上，但如果我将页面限制设置为 50，则只有第一页上的行是可点击的。我在每一行都有按钮，这些按钮也只能在第一页上点击。

我试图用最简单的代码笔来显示这个：

http://codepen.io/cavanflynn/pen/jPvEvB

只有当第一页的列表项被点击时才会弹出警报，而不是任何后续页面。

有人知道会发生什么或能想到一些解决方法吗？谢谢！

【问题讨论】：

标签： javascript jquery html css jquery-plugins

【解决方案1】：

既然你一直在使用 jQuery，为什么不这样呢？

$('#test-list').on('click', 'li', function() { alert("These work, but the rest don't :(") })

编辑以回应您的评论：

来自 jQuery 文档：

事件处理程序仅绑定到当前选定的元素；它们必须在您的代码调用 .on() 时存在。
...
委托事件的优点是它们可以处理来自后代元素的事件，这些事件会在以后添加到文档中。

所以你要做的是选择表格本身，然后在.on() 中选择你想要触发事件的事件和元素。

【讨论】：

这似乎在单击列表项时有效，但我在单击带有代码的表格中的按钮时遇到了同样的问题：$(".testButton").on("click", function () { alert("These work, but the rest don't :("); });