点击时隐藏Twitter Bootstrap导航折叠 [英] Hide Twitter Bootstrap nav collapse on click

问题描述

这不是子菜单下拉菜单，类别是类li，如图所示：

$ b

通过从响应菜单中选择一个类别（模板只是
一页），我想在点击时自动隐藏导航折叠。
也可以漫步作为导航，因为模板只有一个
页面。我寻求一种不影响它的解决方案，这里是菜单的HTML代码
：

 <！ -  NAVBAR 
 ==================================== ==============  - > 
< div class =navbar navbar-fixed-top> 
< div class =navbar-inner> 
< div class =container> 
< a class =btn btn-navbardata-toggle =collapsedata-target =。nav-collapse> 
< span class =icon-bar>< / span> 
< span class =icon-bar>< / span> 
< span class =icon-bar>< / span> 
< / a> 
< a class =brandhref =＃> Carousel Demo< / a> 
< div class =nav-collapse> 
< ul class =nav> 
< li class =active>< a href =＃home>主页< / a>< / li> 
< li>< a href =＃about>关于< / a>< / li> 
< li>< a href =＃portfolio>投资组合< / a>< / li> 
< li>< a href =＃services>服务< / a>< / li> 
< li>< a href =＃contact>联络< / a>< / li> 
<！ - 下拉式广告 - > 
< / ul> 
<！ -  /.nav  - > 
< / div> 
<！ -  /。nav-collapse  - > 
< / div> 
<！ -  /.container  - > 
< / div> 
<！ -  /.navbar-inner  - > 
< / div> 
<！ -  /.navbar  - > 
  

解决方案

试试这个：
$（'。btn-navbar'）。点击（'click'，function（）{
$（'。btn-navbar'）。点击（）; // bootstrap 2.x
$（'。navbar-toggle'）。click（）// bootstrap 3.x by Richard
}）;

This is not a submenu dropdown, the category is class li as in the picture:

By selecting a category from the responsive menu (the template is just one page), I want to hide nav collapse automatically when clicking. Also stroll to use as navigation, since the template has only one page. I seek a solution that does not affect it, here is the HTML code of menu:

    <!-- 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 -->

解决方案

try this:

$('.nav a').on('click', function(){
    $('.btn-navbar').click(); //bootstrap 2.x
    $('.navbar-toggle').click() //bootstrap 3.x by Richard
});

这篇关于点击时隐藏Twitter Bootstrap导航折叠的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！