如何在移动视图中制作Bootstrap导航栏，就像普通菜单一样

Question

http://www.bootply.com/y1iaZwCCct

我在我的网站上使用此菜单但无法更改默认设置。我需要一个jQuery中的脚本，它在移动视图中为菜单做了两件事。

1. 点击链接时关闭。
2. 当我在菜单外单击时关闭。

我是jQuery的新手，所以任何帮助都会受到赞赏。谢谢。

Answer 1

尝试此代码..它适用于我

$(document).mouseup(function (e) {
            e.preventDefault();
            var container = $(".container-fluid");

    if (!container.is(e.target) && container.has(e.target).length === 0) {
                $(".navbar-collapse").collapse('hide');
            }
        });

$(".navbar-nav li a").click(function(e){
                e.preventDefault();

             $(".navbar-collapse").collapse('hide');

  });

Answer 2

找到解决方案......

1. 在data-toggle="collapse"上使用data-target=".in"和a - 标记或列表元素，点击链接时关闭菜单。

2. 此代码用于在菜单外单击时关闭菜单

   $(document).click(function (event) {
       var clickover = $(event.target);
       var $navbar = $(".navbar-collapse");               
       var _opened = $navbar.hasClass("in");
       if (_opened === true && !clickover.hasClass("navbar-toggle")) {      
           $navbar.collapse('hide');
       }
   });