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');
});

jQuery DataTables行突出显示

1 个答案: