数据表 - 如何实现对每一行的列的点击?

Question

我正在尝试在特定列上实现单击功能，但它仅适用于第一行。

我的表是动态的，内容基于来自 Web 套接字的流。

这是我正在尝试做的：

function initTable($table) {
window.dataTable = dataTable = $table.DataTable({
data: workerObjects,
columns: [
{ title: "Agent", data: "friendlyName" },              
{ title: "Listen",
render: function(data, type, row) {                
if ( !row.task ) { return '-' }                  
return `<a href='#' id="join_${row.task.sid}"><i id="${row.task.sid}" class="fa fa-play-circle"></i></a>`
}
},
],
pageLength: 25
});
// https://github.com/benjamine/jLiveTime
$table.livetime();
$table.on('click', 'td:eq(1)', function (event) {
console.log('bang';
});
return dataTable;
}

在特定流程中，我运行dataTable.rows().invalidate().draw();来更新表，因为对象 workerObjects 已更新。

如何使$table.on('click', 'td:eq(1)'...适用于每一行？现在，它仅适用于第一行。

Answer 1

使用

$table.on('click', 'td:nth-child(1)', function (event) {

我对你的代码的理解是，它目前将在表中的第一个TD上触发(eq是表中所有TD的集合(

Answer 2

您可以使用以下代码执行相同的操作，

$table.find('tbody').on('click', 'tr', function () {
var data = dataTable.row(this).data();
alert( 'You clicked on '+data[0]+''s row' );
} );

如原始文档本身所述。请通过以下链接供您参考，

https://datatables.net/examples/advanced_init/events_live.html

希望对您有所帮助！