jQuery DataTables 行高亮

Question

使用 jQuery DataTables，我使用下面的代码突出显示选定的行：

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

我在页面顶部也有这个页面内 CSS 类：

 <style>
   tr.selected {background-color: #a6a6a6;}
 </style>

以上所有内容都相应地起作用。我可以点击该行的任意位置，该行将被突出显示。

但是，我遇到了一个问题。在每一行中，都有用户可以单击以打开模式窗口的链接。如果用户直接点击链接，模态框就会打开，并且该行确实会突出显示。

如果用户先单击该行，然后在同一行内，单击链接打开窗口...现在该行不再突出显示，则会出现问题。

我需要做的是保持该行的突出显示，无论他们点击同一行多少次 - 直到他们点击不同的行。

如何调整上面的 jQuery 来实现这一点？

Answer 1

您可能想要取消突出显示所有行，然后突出显示当前行：

$('#example1 tbody').on('click', 'tr', function() {
  $('#example1 tbody > tr').removeClass('selected');
  $(this).addClass('selected');
});

Answer 2

您可能希望取消突出显示选定的行，然后突出显示当前行：

   /*DataTables highlight selected row*/
    $('#dataTable tbody').on('click', 'tr', function() {
        $('#dataTable tbody > tr').removeClass('row_selected');
        $(this).addClass('row_selected');
    });