Question

我列出了一项体育赛事的结果。每个事件在表中都有自己的行，有些具有多个结果，列为li项。人们需要能够过滤结果，因此通过使用复选框，他们可以消除列表中的结果。我通过将类.gone添加到这些结果来实现此目的，这使得它们显示为：none。但是，如果他们对结果进行过滤，则某些事件不再具有任何可见结果。如果是这种情况，我希望显示表中的完整行：none。

基本上，如果tr中的所有li都具有.gone类，则父tr也应该被赋予.gone类。

我在这方面有点像菜鸟，我在这个网站上尝试了很多不同的例子，但我显然错过了一些东西。

这是HTML：

<table width="100%" border="0" cellpadding="5" cellspacing="0">
<tr>
    <td valign="top" width="75px"><div id="tableHeader">Date</div></td>
    <td valign="top"><div id="tableHeader">Event</div></td>
    <td valign="top"><div id="tableHeader">Location</div></td>
</tr>

<tr id="section">

    <td valign="top">
        <div id="postmeta">3/2/2013</div>
    </td>

    <td valign="top">
        <div class="posttitle" id="post-103">AT&#038;T American Cup</div>
            <ul>
            <li class="Men"><a href="http://usagym.org/PDFs/Results/m_13ac_final.pdf" target="_new">Men's All-Around</a></li>
            <li class="Women"><a href="http://usagym.org/PDFs/Results/w_13ac_final.pdf" target="_new">Women's All-Around</a></li>
            </ul>
    </td>

    <td valign="top">Worcester, Mass.</td>

</tr>


<tr id="section">

    <td valign="top">
        <div id="postmeta">3/1/2013</div>
    </td>

    <td valign="top">
        <div class="posttitle" id="post-106">Nastia Liukin Cup</div>
            <ul>
            <li class="Women"><a href="http://usagym.org/PDFs/Results/w_13nlc_final.pdf" target="_new">Final Results</a></li>
            </ul>
    </td>

    <td valign="top">Worcester, Mass.</td>

</tr>

那么，我尝试了什么？很多事情，但这是我的最后一次尝试：

if ($("#section ul li.gone").length == $("#section ul li").length) {
// all list items are selected
$('tr').addClass('gone');}

我也为此代码道歉。这是我在这里的第一篇文章，我试图调整代码格式。

非常感谢任何帮助。这是我正在处理的页面......如果它有用的话：http://dev-public.usagym.org/2013/?cat=7

更新：正如一位回应者指出的那样，我可以检查事件的li是否被隐藏，如果是，则隐藏事件标题。但是，我最初想要隐藏ul，直到有人点击事件标题。我在页面上没有该代码，但现在我做了。

Answer 1

我认为你在比较集合的长度时有正确的想法。

遍历每个tr并分别应用比较：

$('tr').each(function() {
    var $this = $(this);
    var $lis = $this.find('li');

    if ($lis.length === 0) return;

    if ($lis.filter('.gone').length === $lis.length) {
        $this.addClass('gone');
    } else {
        $this.removeClass('gone');
    }
});

如果没有任何li个孩子，我也会让循环跳过检查，因为它也会遍历你的标题行。

当所有子li具有相同的类时，隐藏父tr

1 个答案: