本文介绍了隐藏行后重新应用表分条(Twitter Bootstrap)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用Bootstrap,并且具有一个带区卷的表,可以通过选择表单上的某些选项来对其进行过滤. Javascript解释表单输入,并隐藏表中与所选条件不匹配的行.

I'm using Bootstrap and have a striped table that can be filtered by selecting some options on a form. Javascript interprets the form inputs, and hides rows from the table that don't match the selected criteria.

但是,这会根据隐藏的行(灰色行紧挨灰色行,白色行紧接着白色行)中断表上的表带.

However, this breaks the table striping on the table depending on which rows are hidden (gray rows next to gray rows, white rows next white rows).

我想根据过滤结果后可见的行重新应用条带化.我怎样才能做到这一点?

I'd like to reapply the striping based on what rows are visible after filtering the results. How can I do this?

在表行上使用.remove()是不可行的,因为如果过滤条件发生变化,我可能需要再次显示它们,并且我试图避免使用AJAX根据过滤器输入动态更新表(我想坚持隐藏DOM元素.

Using .remove() on the table rows is not an option, because I may need to show them again if the filter criteria changes and I'm trying to avoid using AJAX to update the table dynamically based on the filter inputs (I'd like to stick to hiding DOM elements).

感谢您的帮助!如果需要,我可以澄清这个问题:)

推荐答案

是的,这绝对是表分拆中令人讨厌的部分之一.英勇的更好的地方可能是只是在每次更新后重新应用带有jQuery的条带化:

Yes, this is definitely one of the annoying parts of table striping. The better part of valor here is probably just to reapply the striping with jQuery after each update:

$("tr:not(.hidden)").each(function (index) {
    $(this).toggleClass("stripe", !!(index & 1));
});

这篇关于隐藏行后重新应用表分条(Twitter Bootstrap)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

10-30 07:55