相关疑难解决方法(0)

具有嵌套元素的jQuery悬停事件

我现在已经获得了基本的,普通的菜单树,如下所示:

<ul id="nav">
  <li>
    <a href="#">home</a>
    <div class="controls">Some controls go here</div>
    <ul>
      <li>
        <a href="#">item 1</a>
        <div class="controls">Some controls go here</div>
      </li>
      <li>
        <a href="#">item 2</a>
        <div class="controls">Some controls go here</div>
      </li>
    </ul>
  </li>
</ul>
Run Code Online (Sandbox Code Playgroud)

具有"控件"类的div被隐藏起来.我想要发生的是,当你将鼠标悬停在li上时,各个li显示的控件(当你移开鼠标时,它们会再次隐藏).当您将鼠标悬停在其中一个嵌套的li上时会出现问题,它也会显示它的父控件.这是我正在使用的jQuery:

    $("#nav li").hover(
        function() {
            $(".controls:first", this).css("display", "block");
        },
        function() {
            $(".controls:first", this).css("display", "none");
        }
    );
Run Code Online (Sandbox Code Playgroud)

谢谢你的帮助.雷米

jquery nested menu hover

2
推荐指数
1
解决办法
9207
查看次数

标签 统计

hover ×1

jquery ×1

menu ×1

nested ×1