在外部单击时，Superfish 扩展菜单不会关闭答案

【问题标题】：Superfish expanded menu doesn't close when clicking outside在外部单击时，Superfish 扩展菜单不会关闭
【发布时间】：2018-09-13 07:56:39
【问题描述】：

我有这个带有标记的扩展 Superfish 菜单：

<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="true">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>

和：

<div id="navbar-collapse" class="navbar-collapse collapse in" aria-expanded="true" style="">
        <div class="region region-navigation-collapsible">
<section id="block-mainmenu" class="block block-superfish block-superfishmain clearfix">...</section></div></div>

我希望在单击外部菜单时关闭此菜单。

我试过这个 jQuery 代码：

var $menu = $('.menu');
var $button = $('.navbar-toggle');

$button.click(function () {
  $menu.toggle();
});

$(document).mouseup(function (e) {
   if (!$menu.is(e.target) 
   && $menu.has(e.target).length === 0
   && !$button.is(e.target)) 
   {
     $menu.hide();
     $button.addClass("collapsed");
     $button.attr("aria-expanded","false");
     $("#navbar-collapse").attr("aria-expanded","false");
     $("#navbar-collapse").removeClass("in");
  }
 });

但它不能正常工作。它在第一次单击外部时关闭，但然后再次单击它没有按应打开的按钮。是 aria-expanded、classes 和 superfish.js 把事情搞砸了。

它不是其他在点击外部时关闭的简化菜单的副本，因为它的行为要复杂得多。

【问题讨论】：

标签： jquery html drupal menu

【解决方案1】：

对于任何对未来感兴趣的人，通过触发按钮以更简单的方式完成：

var $button = $('.navbar-toggle');
$(document).mouseup(function (e) {
  if ($('#navbar-collapse').hasClass('in')) 
  {
     $button.trigger("click"); 
  }
});

【讨论】：