Question

如何切换导航的多级别。

我尝试使用find ul，然后打开每个子菜单级别。这是我的代码：

HTML

<ul class="level_1">
<li class="submenu">sumenu
<ul class="level_2">
    <li class="submenu">level2
        <ul class="level_3">
        <li>level3</li>
        </ul>
    </li>
</ul>
</li>
</ul>

这是我的CSS

.submenu ul {
    display:none;
}

这是我的Jquery代码

$( ".submenu" ).hover(function() {
  $( this).find("ul").toggle( "slow" );
});

所以我想要的是当我悬停level_1时它应该只打开level_2，当我悬停在level_2时它应该打开level_3。

JsFiddle

Answer 1

您需要使用.children()，因为它可以让直系孩子。而不是.find()，而后者（孩子的孩子也是）

码

$(".submenu").hover(function () {
    $(this).children("ul").toggle("slow");
});

DEMO

Answer 2

试试这个，希望它有所帮助：

$( ".submenu" ).hover(function() {
  $( this).children("ul").first().toggle( "slow" );
});

Jquery切换多层次

2 个答案: