Jquery 从表中删除行后重置zebra样式
我有一个表,它使用bootstrap,使用Jquery 从表中删除行后重置zebra样式,jquery,html,css,twitter-bootstrap,Jquery,Html,Css,Twitter Bootstrap,我有一个表,它使用bootstrap,使用:nth child来设置交替表行的样式。但是,每当我使用jQuery.hide()删除一行时,交替的行就会中断 HTML: 标题A 标题B 品目C 0 B C 1. B C 2. B C 3. B C 4. B C JS: $('#r4').hide() 我想知道是否有一种简单的方法可以用新配置重置表。每次更新后,我都可以创建自己的.偶数和类,并在表中进行筛选,以删除和重新应用这些类,但我希望有一个更优雅的解决方案。除了$('#r4')。remo
:nth child
来设置交替表行的样式。但是,每当我使用jQuery.hide()
删除一行时,交替的行就会中断
HTML:
标题A
标题B
品目C
0
B
C
1.
B
C
2.
B
C
3.
B
C
4.
B
C
JS:
$('#r4').hide()代码>
我想知道是否有一种简单的方法可以用新配置重置表。每次更新后,我都可以创建自己的.偶数和类,并在表中进行筛选,以删除和重新应用这些类,但我希望有一个更优雅的解决方案。除了$('#r4')。remove()代码>,您可以使用如下内容:
$('#r4').after('<tr></tr>').hide();
$('#r4')。在(''.hide()之后;
这会隐藏该元素,并在其后面添加一个空的
元素,取代其删除,从而不会干扰:n子元素的样式设置。编辑
在阅读了您的评论之后,我添加了一个关于如何提取所需行的示例
仅在视觉上隐藏元素。您必须从DOM中删除元素,或者从表中提取元素,才能获得预期的结果
要删除该元素,可以使用
$('#r4').remove()
要提取元素,可以使用
要提取行而不将其从DOM中删除,必须将其附加到表tbody
之外的元素。这可以通过不同的方式完成,但是为了避免额外的标记,您可以在隐藏后将元素附加到表thead
$('#r4').hide().appendTo('table thead')代码>此问题已由回答
这是Manuel的代码,使用JQuery:
$('tr').removeClass('alternate')
$('tr:not(.hide):odd').addClass('alternate')
这是原件。看一看
此处发布的一些解决方案包括:
1) 重复渐变背景(仅CSS)
2) 类型的第n个
、n个子
和波浪线选择器的组合。(仅限CSS)
3) 存储在缓存对象中
我不希望将其从DOM中删除,因为它是可切换的。使用.hide()
和.show()
最简单,而不是将其添加到表中已删除元素的队列和yada-yada。。。可能会很好。我不喜欢添加这样的“填充”元素,但它似乎会起作用。我将不得不使用它一点,看看它是否能与我的实现一起工作。=)@Ryan是的-它工作得很好。我最近用过类似的东西。问题是:n子项不知道跳过隐藏的元素。这基本上取代了它。在做了一点修改之后,我想出了另一个解决方案$('#r4')。hide()。appendTo('table thead')代码>为什么这会被否决?我已经认可了原始海报,并将该问题标记为重复问题。有点旧,但该代码对我很有效。您刚刚输入了一个错误:$('tr')。removeClas('alternate'))
$('tr').removeClass('alternate')
$('tr:not(.hide):odd').addClass('alternate')