Question

我发起了一个数据表插件，如下所示：

var table= $("#mytable").DataTable({

    ajax: "list.json",
    columns: [
        {"data": "name"},
        {"data": "location"},
        {"data": "date"}
    ],
    searchCols: [
        {"search": "John"},
        null,
        null
    ]
});

上面的例子也对第一列进行了预搜索。现在，当插件启动时，我想与它的一些行进行交互：

fnInitComplete: function() {
   $(this).find("tr").click( ... );
}

一切正常，直到我尝试与在桌面上搜索的行进行交互{"search": "John"}并且之后再次搜索（例如我将搜索查询更改为＆＃34; Richard＆＃34;并试图点击其中一行）。有什么想法吗？

Answer 1

您需要使用委托事件处理程序，因为jQuery DataTables在每个表绘制上操作DOM。

例如：

var table= $("#mytable").DataTable({   
    ajax: "list.json",
    columns: [
        {"data": "name"},
        {"data": "location"},
        {"data": "date"}
    ],
    searchCols: [
        {"search": "John"},
        null,
        null
    ]
});

$("#mytable").on("click", "tr", function(){
   // Handle click event
});

数据表：搜索后无法与行进行交互

1 个答案: