在单击时隐藏Twitter Bootstrap导航折叠
在单击时隐藏Twitter Bootstrap导航折叠
提问于 2013-05-22 06:26:25
这不是一个子菜单下拉菜单，类别是li类，如图所示：
通过从响应式菜单中选择一个类别(模板只有一页)，我希望在单击时自动隐藏导航折叠。由于模板只有一个页面，因此也可以使用漫步作为导航。我寻求一个不影响它的解决方案，这里是菜单的HTML代码：
<!-- NAVBAR
================================================== -->
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="#">Carousel Demo</a>
<div class="nav-collapse">
<ul class="nav" >
<li class="active"><a href="#home">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<li><a href="#services">Services</a></li>
<li><a href="#contact">Contact</a></li>
<!-- dropdown -->
</ul>
<!-- /.nav -->
</div>
<!--/.nav-collapse -->
</div>
<!-- /.container -->
</div>
<!-- /.navbar-inner -->
</div>
<!-- /.navbar -->回答 31
Stack Overflow用户
回答已采纳
发布于 2013-05-22 06:32:14
试试这个：
$('.nav a').on('click', function(){
$('.btn-navbar').click(); //bootstrap 2.x
$('.navbar-toggle').click(); //bootstrap 3.x by Richard
$('.navbar-toggler').click(); //bootstrap 4.x
});Stack Overflow用户
发布于 2014-02-15 20:27:41
我只是在每个链接上复制btn-navbar (data-toggle="collapse" data-target=".nav-collapse.in")的两个属性，如下所示：
<div class="nav-collapse">
<ul class="nav" >
<li class="active"><a href="#home" data-toggle="collapse" data-target=".nav-collapse.in">Home</a></li>
<li><a href="#about" data-toggle="collapse" data-target=".nav-collapse.in">About</a></li>
<li><a href="#portfolio" data-toggle="collapse" data-target=".nav-collapse.in">Portfolio</a></li>
<li><a href="#services" data-toggle="collapse" data-target=".nav-collapse.in">Services</a></li>
<li><a href="#contact" data-toggle="collapse" data-target=".nav-collapse.in">Contact</a></li>
</ul>
</div>在Bootstrap 4 Navbar中，in已更改为show，因此语法为：
data-toggle="collapse" data-target=".navbar-collapse.show"
Stack Overflow用户
发布于 2013-10-15 23:59:54
$(function() {
$('.nav a').on('click', function(){
if($('.navbar-toggle').css('display') !='none'){
$('.navbar-toggle').trigger( "click" );
}
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/16680543
复制相关文章
相似问题