2015-04-23 126 views
1

我加載了bootstrap css和js文件並添加了以下html代碼。 這兩個都成功加載 - 頭標籤中的CSS和頁腳下的JS。其他功能也正常工作。bootstrap導航欄移動切換不起作用

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> 
    <div class="container container-header"> 

    <!-- Brand and toggle get grouped for better mobile display --> 
    <div class="navbar-header"> 
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"> 
     <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="{{ url_for('public.home') }}"> 

     NekTime 

    </a> 
    </div> 
    <!-- Collect the nav links, forms, and other content for toggling --> 
    <div class="collapse navbar-collapse navbar-ex1-collapse"> 
    <ul class="nav navbar-nav"> 
     <li><a href="{{ url_for('public.home') }}">Home</a></li> 
     <li><a href="{{ url_for('public.about') }}">About</a></li> 
    </ul> 
    {% if current_user and current_user.is_authenticated() %} 
    <ul class="nav navbar-nav navbar-right"> 
     <li> 
      <p class="navbar-text"><a class="navbar-link" href="{{ url_for('user.members') }}">Logged in as {{ current_user.username }}</a></p> 
     </li> 
     <li><a class="navbar-link" href="{{ url_for('public.logout') }}"><i class="fa fa-sign-out"></i></a></li> 

    </ul> 
    {% elif form %} 
    <ul class="nav navbar-nav navbar-right"> 
     <li><a href="{{ url_for('public.register') }}">Create account</a></li> 
    </ul> 
    <form id="loginForm" method="POST" class="navbar-form form-inline navbar-right" action="/" role="login"> 
     {{ form.hidden_tag() }} 
     <div class="form-group"> 
     {{ form.username(placeholder="Username", class_="form-control") }} 
     {{ form.password(placeholder="Password", class_="form-control") }} 
     </div> 
     <button type="submit" class="btn btn-default">Log in</button> 
    </form> 
    {% endif %} 
    </div><!-- /.navbar-collapse --> 
    </div><!-- /.container --> 
</nav> 

當我收縮瀏覽器時,切換按鈕替換其他菜單,但我無法展開該切換按鈕。 我設法得到正確的數據目標..我不知道下一步該怎麼做

回答

0

它在第二天工作..當我改變加載jquery的代碼。猜猜以前的代碼,以使jquery無法正常工作。

1

我在按鈕標記中添加了collapsed類,它的工作原理。看下面的代碼。

<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-ex1-collapse">