Question

我试图找到解决方案，在其外部点击（在移动窗口大小）时关闭引导程序菜单，但是无法使其工作，我通过此代码单击其中一个“a”链接时可以使用它： / p>

// 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

是的，我已经尝试了这个，没有工作：

similar question

Answer 1

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

只需复制代码并通过您的客户脚本或index.html

即可

谢谢雷米单击外部隐藏引导程序切换菜单关闭（隐藏）它

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/粗略地显示了这个概念。

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

单击外部引导菜单以关闭它

3 个答案: