切换 ul（子菜单）

Question

当我将鼠标悬停在

上时，如何显示

内的第一个

？

Answer 1

HTML:

<ul>
    <li class="firstLevel">
        <ul></ul>
    </li>
    <li class="firstLevel"></li>
    <li class="firstLevel"></li>
</ul>

JS:

$('li.firstLevel').hover(function(){
    $(this).find('ul:first').show();
},
function(){
    $(this).find('ul:first').hide();
});

注意：这仅适用于不支持 lis 上 hover 的浏览器 (IE6)

Answer 2

$("ul.menu>li").hover(
  function() {
    $(this).children("ul:first").show();
  },
  function() {
    $(this).children("ul:first").hide();
  }
);

Answer 3

只是为了提倡CSS。如果你不支持 IE6 并且不需要特殊效果，我建议使用 CSS 来实现：

ul.menu li > ul {
  display: none;
}

ul.menu li:hover > ul {
  display: block;
}