jquery多个二级下拉菜单

你可以使用jQuery来实现多个二级下拉菜单，下面是一个简单的例子：

HTML代码：

<nav>
  <ul>
    <li><a href="#">菜单1</a>
      <ul>
        <li><a href="#">子菜单1</a></li>
        <li><a href="#">子菜单2</a></li>
      </ul>
    </li>
    <li><a href="#">菜单2</a>
      <ul>
        <li><a href="#">子菜单3</a></li>
        <li><a href="#">子菜单4</a></li>
      </ul>
    </li>
  </ul>
</nav>

CSS代码：

nav ul ul {
  display: none;
}

nav ul li:hover > ul {
  display: block;
}

jQuery代码：

$("nav ul li").hover(
  function() { // 鼠标进入
    $(this).children("ul").stop().slideDown(200);
  },
  function() { // 鼠标离开
    $(this).children("ul").stop().slideUp(200);
  }
);

这段代码使用了hover()方法，当鼠标进入或离开li元素时，会分别触发回调函数，通过children()方法和slideDown()/slideUp()方法，来显示或隐藏子菜单。

注意，这里的CSS样式使用了display:none来隐藏子菜单，jQuery代码中使用了slideDown()/slideUp()方法来显示/隐藏子菜单，因此需要在CSS中设置一个默认的display:none样式。