Javascript 移动设备上的引导导航栏未关闭
我正在使用引导navbar切换,目标是类navbar已折叠,但我的navbar不会在移动设备上自动关闭:Javascript 移动设备上的引导导航栏未关闭,javascript,html,twitter-bootstrap,Javascript,Html,Twitter Bootstrap,我正在使用引导navbar切换,目标是类navbar已折叠,但我的navbar不会在移动设备上自动关闭: <div class="navbar navbar-default navbar-fixed-top" role="navigation" id="navbar"> <div class="container"> <div class="navbar-header"> <button type="bu
<div class="navbar navbar-default navbar-fixed-top" role="navigation" id="navbar">
<div class="container">
<div class="navbar-header">
<button 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 scrollTo" href="#intro"><img id="bg-img" src="./img/hn-logo.png"></a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li class="active"><a href="#intro">Home</a>
</li>
<li><a href="#section1">Products</a>
</li>
<li><a href="#section2">Learn</a>
</li>
<li><a href="#section3">Lab Testing</a>
</li>
<li><a href="#section4">Partners</a>
</li>
<li><a href="#contact">Contact</a>
</li>
</ul>
</div>
<!--/.nav-collapse -->
</div>
</div>
切换导航
-
-
-
-
-
-
试试这个,在脚本标签中添加这个Jquery
<script type="text/javascript">
$('.nav a').on('click', function () {
$('.btn-navbar').click(); //bootstrap 2.x
$('.navbar-toggle').click() //bootstrap 3.x
});
</script>
$('.nav a')。在('click',函数(){
$('.btn navbar')。单击();//引导程序2.x
$('.navbar toggle')。单击()//引导3.x
});
通过CDN或从您自己的来源包括jquery
jQuery CDN
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
然后包括引导js CDN
引导
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
是否包含jquery和bootstrap.js?折叠功能是通过javascript添加的,而不仅仅是CSW。什么会自动关闭?你仍然需要点击切换按钮来关闭它。对,我希望它在点击后关闭