引导导航按钮下拉按钮不会在单击时消失。

Question

我的引导站点上的下拉列表有一点小问题。

这里

当导航条折叠到可切换按钮，我点击它，它正确地显示下拉列表，但当我点击一个链接，它转到正确的部分，下拉列表不会像我想要的那样消失。

这是我的第一个引导网站我是个新手webdev..。所以，尽管搜索了自举网站.我空着走了。

任何帮助都是非常感谢的。

亚历克斯

Answer 1

就像这样：

将一个id设置为按钮，并将普通的class名称设置为导航栏中的链接按钮，并写入条件，例如单击链接按钮时，当导航处于以下折叠状态时，按钮切换到一起。

演示

 <nav class="navbar navbar-default" role="navigation">
            <div class="container-fluid">
                <!-- Brand and toggle get grouped for better mobile display -->
                <div class="navbar-header">
                    <button id="btnCollapse" type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="#">Brand</a>
                </div>

                <!-- Collect the nav links, forms, and other content for toggling -->
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    <ul class="nav navbar-nav">
                        <li class="active"><a class="a" href="#">Link</a></li>
                        <li><a class="a" href="#">Link</a></li>
                        <li><a class="a" href="#">Link</a></li>
                        <li><a class="a" href="#">Link</a></li>
                    </ul>
                </div>
                <!-- /.navbar-collapse -->
            </div>
            <!-- /.container-fluid -->
        </nav>

剧本：

 $(".a").click(function () {
            if ($("#btnCollapse").css('display')!='none')
            $("#btnCollapse").click();
        });