javascript - 当我在 jquery 数据表中每页显示 25 条记录时，单击事件不起作用

Question

我对数据表 jQuery 插件有疑问。当我的数据表加载时，默认前页值为 10，但之后我更改为每页 25 条记录。因此，在第 10 条记录之后，点击事件不起作用。

我将此代码用于点击事件:

function driverClickable(){  $('#tabletest tbody tr').click(function() {
//setDriverEvents();
var data = $(this).html();
//console.log(data);
var find = '<td>';
var find2 = '</td>';
var find3 = '<td class="sorting_1">';
var re = new RegExp(find, 'g');
var re2 = new RegExp(find2, 'g');
var re3 = new RegExp(find3, 'g');
data = data.replace(re, ',');
data = data.replace(re2, '');
data = data.replace(re3, '');    
ViewDriver(data);    }); }

function setDriverEvents(){  driverClickable();
 $('#tabletest').on( 'page.dt', function () {
setTimeout(function(){
  driverClickable();
}, 500);   });}

这是我将数据添加到数据表中的代码

tableDriverData = $('#tabletest').dataTable({
        "data": driverData,
    });

此问题的正确解决方案是什么？

Answer 1

CAUSE

出于各种原因，DataTables 会从 DOM 中删除不可见的行，因此当您附加事件处理程序时，它仅适用于当前可见的元素。

SOLUTION

您需要通过在 on() 中提供选择器作为第二个参数来使用事件委托(delegate)。打电话。

$('#tabletest tbody').on('click', 'tr', function(){
   // ... skipped ...
});

LINKS

参见jQuery DataTables – Why click event handler does not work了解更多信息。