跨多个表的jQuery备用行的颜色(jQuery alternate row colors acro

我注意到与交替行颜色严格使用jQuery的问题。 你可以看一下这个捣鼓了什么，我将描述一个例子。

我使用CSS3来控制跨多个表如预期该工作表分拆。

.table-zebra tbody > tr:nth-child(even) > td {background-color: lightgrey;}

每个偶数行条纹浅灰色。 计数从第一行开始。

对于不支持CSS3使用jQuery来模仿这种浏览器：（。表条纹用于这个例子来说明在小提琴的区别）

  $(".table-striped tr:odd").css("background-color", 'lightgrey');

当我有奇数行中的多个表的jquery从上表继续计数，这错误地交替行。

除了使用$。每有一个简单的jQuery中处理这种方式？

Answer 1:

据我所知， :odd跨应用了所有<TR> S和因此你得到你所描述的行为。 我不认为有什么办法改变这种状况，使:odd相对于当前.table-striped ，除非使用.each()

对于这个特定的情况下，虽然有一个解决办法:nth-child ：

$(".table-striped tr:nth-child(:odd)").css("background-color", 'lightgrey');

但适用某一特定<TR>是其直接父的奇子，因此可能做错事，如果你的<TABLE>小号包含多个<TBODY>秒。

Answer 2:

CSS：

tr.even td {
    background-color: green;
}
tr.odd td {
    background-color: yellow;
}

JS：

 $('.table-striped > tbody').each(function () {
     $('tr:odd', this).addClass('odd').removeClass('even');
     $('tr:even', this).addClass('even').removeClass('odd');
 });

DEMO这里

文章来源: jQuery alternate row colors across multiple tables