Datatables向所有正文行添加类

Question

我是Datatables的新手，我有一个默认情况下只显示前10行的表。我正在尝试将这个类添加到所有行，而不仅仅是默认的10行……

var table = $("#datatable-buttons").DataTable({...})
table.rows.removeClass('selected')

和

$('tbody tr').removeClass('selected')

和

$(tables.table().body()).removeClass('selected')

但是没有任何成功:(是否可以仅通过单击一个按钮向所有行添加/删除select类？

Answer 1

我认为将某个类添加到所有行的最好方法是在初始化时：

var table = $('#example').DataTable({
  createdRow: function ( row, data, index ) {
     $(row).addClass('selected')
  } 
}) 

您可以使用以下命令在单击时向行中添加/删除类

table.on('click', 'tbody tr', function() {
  var $row = table.row(this).nodes().to$();
  var hasClass = $row.hasClass('selected');
  if (hasClass) {
    $row.removeClass('selected')
  } else {
    $row.addClass('selected')
  }
})

您还可以通过代码将类移除(或添加)到所有行，方法是

table.rows().every(function() {
  this.nodes().to$().removeClass('selected')
})

所有示例都在这里运行->

Answer 2

向所有行添加类

$('#datatable tbody').on( 'click', 'tr', function () {
  $('#datatable tbody tr').addClass('selected');
}

从所有行中删除类(并仅选择您单击的行)

$('#datatable tbody').on( 'click', 'tr', function () {

  // Removing all the selections
  $('#datatable tbody tr').removeClass('selected');

  // selecting the on which you clicked
  $(this).toggleClass('selected');
}