Question

我正在使用jQuery DataTables和一些自定义代码来构建网站的比较篮。

我知道.change()会强制更改事件但是当我从DataTables中执行此操作时，它似乎无效。

以下是有问题的代码：

table.on('change', '[type="checkbox"]', function () {
~
~
~
removeCtrl.addEventListener('click', function () {
    var removal_id = $(this).parent().data("idx");

    // .change() forces the 'changed' event to trigger.
    $('#' + removal_id).prop('checked', false).change();

    $(this).parent().remove();
});
});

此代码附加到图像右上角的小“X”。图像本身完全在DataTables之外。

此行找到需要取消选中的确切复选框并取消选中它，然后应该触发change事件，但这似乎不起作用。它适用于我所在的任何页面。但是如果我在第2页并且需要取消选中的复选框位于第1页，它将取消选中它，但是不会触发更改事件，我需要触发它。

我也试过了table.$('#' + removal_id).prop('checked', false).change();，它做了同样的事情。表引用DataTable对象。

当我与需要取消选中的复选框位于同一页面时，更改事件会正确触发。

知道我需要更改什么才能在不与复选框位于同一页面时触发更改事件？

Answer 1

<强>原因

DOM中不存在其他页面上的元素。您使用的委托事件处理程序如下所示仅适用于DOM中存在的元素。

table.on('change', '[type="checkbox"]', function(){});

<强>解

使用change事件处理程序的命名函数替换匿名函数，例如onCheckboxChange，如下所示。

function onCheckboxChange(e){
   console.log(this);
}

// ... skipped ...

table.on('change', '[type="checkbox"]', onCheckboxChange);

然后，当您需要触发复选框的句柄change事件时，请使用以下代码：

$('#' + removal_id)
   .prop('checked', false)
   .each(function(){
      onCheckboxChange.call(this);
   });

如何在Datatables中强制执行.change（）事件？

1 个答案: