Question

给出以下示例嵌套列表：

＆＃13;

<ul id="toplist">
    <li>Item 1</li>
    <ul>
        <li class="active">Item 1a</li>
        <li>Item 1b</li>
    </ul>
    <li>Item 2</li>
    <ul>
        <li>Item 2a</li>
        <li>Item 2b</li>
    </ul>
    <li>Item 3</li>
    <ul>
        <li>Item 3a</li>
        <li>Item 3b</li>
    </ul>
</ul>

＆＃13;

我希望能够隐藏没有班级li的孩子的每个顶级active。因此，在上面的例子中，应隐藏 Item 2 及其子项，以及 Item 3 及其子项。 第1项及其子女应该留下来。

我尝试过类似的事情：

$("#toplist").not(".active").hide();

但这消除了一切。

Answer 1

假设您更正了无效的HTML（您不能将<ul>作为另一个<ul>的子项，只有<li>），这可行：

$('#toplist > li').each(function () {
    if (!$(this).find('li.active').length) $(this).hide();
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul id="toplist">
    <li>Item 1
        <ul>
            <li class="active">Item 1a</li>
            <li>Item 1b</li>
        </ul>
    </li>
    <li>Item 2
        <ul>
            <li>Item 2a</li>
            <li>Item 2b</li>
        </ul>
    </li>
    <li>Item 3
        <ul>
            <li>Item 3a</li>
            <li>Item 3b</li>
        </ul>
    </li>
</ul>

隐藏基于类

1 个答案: