将更改事件绑定到每个 DataTables 行中的复选框答案

【问题标题】：Bind change event to checkbox in each DataTables row将更改事件绑定到每个 DataTables 行中的复选框
【发布时间】：2016-12-18 09:30:03
【问题描述】：

我为DataTables 中的每一行添加了一个复选框。加载表数据时，我将更改事件绑定到每个复选框，如下所示：

fnInitComplete: function(oSettings, json) {

      $("input[type='checkbox']").on("change", function() {

            // checking if any checkbox is checked

      });
}

问题是只为第一页添加了更改事件。如果我导航到其他页面并单击任何复选框，则不会触发任何事件。它仅在我刷新页面时才有效。 Show entries 也是如此。处理这个问题的聪明方法是什么？

【问题讨论】：

在页面更改时，您必须再次触发该事件，以实现这一目标。或者将此函数放在加载事件上。

标签： jquery events checkbox datatables

【解决方案1】：

尝试使用委托事件：

$("#table_id").on('change',"input[type='checkbox']",function(e){
    //your code 
});

这告诉表在“更改”事件源自作为其后代的input[type='checkbox'] 时运行指定的函数。

顺便说一下，在表格初始化中不需要注册这个handler，文档准备好后就可以了。

More about delegated events

【讨论】：

【解决方案2】：

您可以将您的代码放在这里 .on( 'page.dt', function () { // do something}) 检查the link 以获取有关此的更多说明，或者您可以使用以下代码放置此事件。

$(function(){$("input[type='checkbox']").on("change", function() {

            // checking if any checkbox is checked

      });})

【讨论】：