具有隐藏行的表的JQuery选择器 - 备用行着色

Question

我有一张桌子，通常我会使用这个选择器来应用奇数和偶数行：

table.find('tbody tr:even').addClass('even');
table.find('tbody tr:odd').removeClass('even');

我的表在不同的地方插入行，因此我将其从奇数行中删除。

我现在使用

隐藏了某些行

jQueryTrObject.hide();

我想要应用与之前相同的样式，以便在用户关注的情况下，备用行被标记为奇数和偶数，并且我希望它考虑到隐藏的行。

我如何编写选择器来执行此操作，因为我必须使用每个选项并专门检查吗？

Answer 1

使用:visible选择器

table.find('tbody tr.even').removeClass('even');
table.find('tbody tr:visible:even').addClass('even');

请务必先使用它，以便:even过滤器适用于此之后。

Answer 2

试试这个：

table.find('tbody tr').removeClass('even')
    .filter(':visible:even').addClass('even');

Answer 3

使用:not(:hidden)选择器

table.find('tbody tr:not(:hidden):even').addClass('even');

Answer 4

您可以使用：visible选择器仅标记可见行：

table
    .find('tbody tr:visible:even')
    .addClass('even')
.end()
    .find('tbody tr:visible:odd')
    .removeClass('even');
.end();