Question

嗨，大家好我正在用twitter bootstrap构建一个网站，目前我遇到了这个.nav-collapse类的问题。一旦网站调整大小并且扳手按钮出现，它将变得不可点击。

这是有缺陷的代码和JS Fiddle

<div class="container">
  <div class="navbar-wrapper">      
    <!-- Wrap the .navbar in .container to center it within the absolutely positioned parent. -->      
    <div class="container">       

      <div class="navbar navbar-inverse">          
        <div class="navbar-inner">
          <!-- Responsive Navbar Part 1: Button for triggering responsive navbar (not covered in tutorial). Include responsive CSS to utilize. --> 
          <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="index.html">SingPath</a> 
          <!-- Responsive Navbar Part 2: Place all navbar contents you want collapsed withing .navbar-collapse.collapse. -->
          <div class="nav-collapse collapse">
            <ul class="nav pull-right">
                <li> 
                  <a href="index.html#/quests">Quests</a>
                </li>
                <li> 
                  <a href="index.html#/practice">Practice</a>
                </li>
                <li> 
                  <a href="index.html#/teach">Challenges</a>
                </li>
                <li> 
                  <a href="index.html#/ranking">Rankings</a>
                </li>
                <!-- Read about Bootstrap dropdowns at http://twitter.github.com/bootstrap/javascript.html#dropdowns -->                 
                <li class="dropdown">                  
                  <a href="" class="dropdown-toggle" data-toggle="dropdown">More... 
                    <b class="caret"></b></a>                  
                  <ul class="dropdown-menu">                    
                    <li>
                    <a href="index.html#tournaments">Tournaments</a>
                </li>                    
                <li>
                <a href="index.html#trials">Trials</a>
                </li>                    
                <li>
                <a href="index.html#challenges">Events</a>
                </li>                    
                <li>
                <a href="index.html#rankings">Statistics on Tournaments</a>
                </li>     
                <li>
                <a href="index.html#challenges">Teaching</a>
                </li>
                <li>
                <a href="index.html#challenges">Contribute Problems</a>
                </li>               
                <li class="divider">
                </li>                    
                <li class="nav-header">Create
                </li>                    
                <li>
                <a href="index.html#challengeCreator">Challenges</a>
                </li>                    
                <li>
                <a href="index.html#story">Story</a>
                </li>                    
                <li>
                <a href="#">Tutorials</a>
                </li>                                     
              </ul>                
              </li>
                <li>
                  <a href="index.html#profile">Profile</a>
                </li>                           
              </ul>            
            </div>
            <!--/.nav-collapse -->  
       </div>
        <!-- /.navbar-inner -->        
      </div>
      <!-- /.navbar -->   
    </div> 
    <!-- /.container -->    
  </div>

http://jsfiddle.net/wowlihe/bSZW2/

任何人都知道为什么会这样？非常感谢！

Answer 1

您缺少必需的javascript文件...对于此文件，它是bootstrap-collapse.js。

工作jsfiddle（由thefourtheye） - http://jsfiddle.net/bSZW2/1/

Bootstrap扳手按钮不可点击

1 个答案: