单击外部引导程序菜单以将其关闭

Question

我尝试找到在外部（在移动窗口大小下）单击以关闭引导菜单的解决方案，但无法使其正常工作，而在通过以下代码单击“ a”链接之一时，它就可以正常工作：

// menu buttons collapses when clicking a link
    $('document').ready(function() 
{
    if ($('a').on('click', function() 
            { 
                $('.collapse, #mainContainer').removeClass('in'); 
                $('.navbar-toggle').toggleClass('collapsed'); // button
            }));
});

但是如何通过单击菜单导航栏外部来关闭菜单？

这是我的页面，显示问题iwebdesign.se

是的，我已经尝试过了，不能正常工作：

类似的问题

Answer 1

  $(document).on('click',function(){
   $('.collapse').collapse('hide');
});

只需复制代码并经过您的自定义脚本或index.html

感谢雷米（Remy）在外面单击以隐藏引导程序切换菜单，关闭（隐藏）它

Answer 2

这里的答案：

   (document).on('click',function(){
   $('.collapse').collapse('hide');
})

希望对您有所帮助:)

雷米

Answer 3

假设您想在菜单外部单击时（即折叠菜单）与在菜单内部单击时想做的事情有所不同，那么您可能希望这样来确定您是在菜单内部还是在菜单外部单击：

$('body').click(function(event){
  // check if the clicked element is a descendent of navigation 
  if ($(event.target).closest('.navigation').length) {
    return; //do nothing if event target is within the navigation
  } else {
  // do something if the event target is outside the navigation
     // code for collapsing menu here...
  }
});

https://jsfiddle.net/L3qg4pa8/5/大致显示了这个概念。

当然，您需要将.closest()语句中的'.navigation'替换为导航容器的相应选择器。