单击jQuery或JavaScript菜单下拉菜单

debugcn 发表于 Dev

斯勒布鲁（SleBluue）

现在，我正在尝试构建一个垂直菜单，该菜单下面将有一个下拉子菜单。

以下是我正在使用的HTML和jQuery函数：

$(function() {
    $('#menusomething > li').click(function(e) {
        e.stopPropagation();
        var $el = $('ul', this);
        $('#menusomething > li > ul').not($el).slideUp();
        $el.stop(true, true).slideToggle(400);
    });
    $('#menusomething > li > ul > li').click(function(e) {
        e.stopImmediatePropagation();
    });
});

<div id="navmenu">
  <ul id="menusomething" style="padding-left:30px">
    <li><a href="#">HOME</a></li>
    <li><a href="#">ABOUT</a></li>
    <li><a href="#">CHAPTERS</a></li>
    <ul class="submenu">
      <li><a href="#">Dallas</a></li>
      <li><a href="#">Los Angeles</a></li>
      <li><a href="#">New York</a></li>
      <li><a href="#">Northern California</a></li>
      <li><a href="#">Orange County</a></li>
      <li><a href="#">Phoenix</a></li>
      <li><a href="#">San Diego</a></li>
      <li><a href="#">Washington DC</a></li>
    </ul>
    <li><a href="#">MEMBER SERVICES</a></li>

斯勒布鲁（SleBluue）

找出答案的人。首先必须将结束的li标签从各章移到.submenu的末尾，然后使用它，现在它可以按需工作了。

$(function() {
  $('#menusomething li > .submenu').parent().click(function() {
 var submenu = $(this).children('.submenu');
 if ( $(submenu).is(':hidden') ) {
 $(submenu).slideDown(400);
 } else {
 $(submenu).slideUp(400);
 }
});
});

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。