jquery - 如何对表格进行排序并在使用 jquery 排序时保持交替背景颜色？

Question

开始对列进行排序后，我的表格行背景颜色出现问题。当我的文档加载时，代码运行如下:

$('tbody tr:even').css('background-color','#F1F1F1');
$('tbody tr:odd').css('background-color','#FFFFF0');

对我的 th 进行排序的代码是这样的:

$('.toggle').toggle(function(){
    $(this).css("background-image", "url('desc.gif')");
}, function(){
    $(this).css("background-image", "url('asc.gif')");
});

但是一旦他们开始排序，偶数行就在彼此之上，奇数行就在彼此之上。排序时我可以做什么来改变行颜色？我已经尝试过以下方法但不起作用:

$('.toggle').toggle(function(){
   $(this).css("background-image", "url('desc.gif')");
   $('tbody tr:even').css('background-color','#F1F1F1');
   $('tbody tr:odd').css('background-color','#FFFFF0');
 }, function(){
   $(this).css("background-image", "url('asc.gif')");
   $('tbody tr:even').css('background-color','#F1F1F1');
   $('tbody tr:odd').css('background-color','#FFFFF0');                 
 });

Answer 1

如果您只使用jQuery Tablesorter，您就可以获得开箱即用的排序和斑马条纹功能。 。我一直用它，效果很好。

设置了排序以保持正确的交替行颜色的表格示例如下:

$("#mytable").tablesorter({
  widgets: ['zebra']
});