我在Bootstrap 3中有或多或少的标准导航
<body data-spy="scroll" data-target=".navbar-collapse"> <!-- ---------- Navigation ---------- --> <div class="navbar navbar-fixed-top" role="navigation"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="sr-only">Toggle navigation</span> </button> <a class="navbar-brand" href="index.html"> <img src="#"></a> </div> <div class="navbar-collapse collapse"> <ul class="nav navbar-nav navbar-right"> <li class="active"><a href="#home">Home</a></li> <li><a href="#one">One</a></li> <li><a href="#two">Two</a></li> <li><a href="#three">Three</a></li> <li><a href="#four">Four</a></li> </ul> </div> </div> </div>
它通常会在较小的设备上崩溃。单击菜单按钮可展开菜单,但是如果我单击(或触摸)菜单链接,菜单将保持打开状态。要关闭它又该怎么办?
Bootstrap的默认设置是在单击菜单项时保持菜单打开。您可以通过调用.collapse('hide');要折叠的jQuery元素来手动覆盖此行为。
.collapse('hide');