Question

我正在使用手风琴播放移动菜单，并且我试图阻止打开多个部分（subnavs）。

这是我的工作js，它将以独立的方式打开和关闭subnav但每个部分。（其中可以打开多个subnav）：

标记：

<ul class="navigation-menu">
   <li class="white-hover">
      <div class="drop">
        <ul>
            <li>...</li>
            <li>...</li>
            <li>...</li>
        </ul>
      </div>
   </li>
   <li>...</li>
   <li>...</li>
</ul>

JS：

  jQuery('.white-hover').click(function(e) {
      jQuery(this).toggleClass('drop-down');
      jQuery(this).find(".drop").toggleClass('mobil-active');
 });

如果使用.each：

，我尝试折叠打开的部分

JS：

  jQuery('.white-hover').click(function(e) {

     jQuery('.white-hover').find(".drop").each(function() {
        if (jQuery(this).hasClass('mobil-active'));
        {
           jQuery(this).toggleClass('mobil-active');
        }
     });

     jQuery(this).toggleClass('drop-down');
     jQuery(this).find(".drop").toggleClass('mobil-active');
  });

我想要实现的只是一次打开一个部分。如果用户要点击已关闭的部分，则应打开该部分，如果要打开则关闭其余部分。

Answer 1

这是你想要做的吗？您可以使用.siblings()查找其他菜单并关闭它们，而不是使用if语句：

$('.white-hover').click(function() {
  $(this).find(".drop ul").slideDown().end().siblings("li").find(".drop ul").slideUp();
});

FIDDLE

移动菜单手风琴逻辑

1 个答案: