2014-04-12 191 views
0

我在導航欄左側有一組選項卡,最右側有一個按鈕和下拉菜單。我的路徑似乎是正確的,我遵循getbootstrap文檔中所述的代碼。問題是下拉式菜單在點擊時無法打開。什麼都沒發生。Twitter Bootstrap 3下拉菜單不起作用

<link rel="stylesheet" href="css/bootstrap.css"> 
<link rel="stylesheet" href="css/bootstrap-theme.min.css"> 

<body> 
    <div id="MainWrap"> 
     <div class="container"> 
      <h1 href="#" c;ass="text-muted"></h1> 

      <div class="navbar navbar-default" > 
       <div class="navbar-header"> 
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse"> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
        </button> 
       </div> 
       <div class="navbar-collapse collapse navbar-responsive-collapse"> 
        <ul class="nav navbar-nav nav-tabs"> 
         <li class="active"><a href="#home" data-toggle="tab">Home</a></li> 
         <li><a href="#about" data-toggle="tab">About</a></li> 
         <li><a href="#contact" data-toggle="tab">Contact</a></li> 
         <li><a href="#services" data-toggle="tab">Services</a></li> 
         <li><a href="#staff" data-toggle="tab">Our Staff</a></li> 
        </ul> 

        <ul class="nav navbar-nav navbar-right"> 
         <li><a href="</a></li> 
         <li class="dropdown"> 
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Resources<b class="caret"></b></a> 
          <ul class="dropdown-menu"> 
          <li><a href="#">Action</a></li> 
          <li><a href="#">Another action</a></li> 
          <li><a href="#">Something else here</a></li> 
          <li class="divider"></li> 
          <li><a href="#">Separated link</a></li> 
          </ul> 
         </li> 
        </ul> 
       </div> 
      </div> 
     </div> 
    </div> 

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> 
    <script src="js/jquery-1.11.0.min"></script> 
    <!-- Include all compiled plugins (below), or include individual files as needed --> 
    <!-- Latest compiled and minified JavaScript --> 
    <script src="js/bootstrap.js"></script> 
    </body> 

控制檯日誌錯誤我得到:

Failed to load resource: net::ERR_FILE_NOT_FOUND file:///C:/Users//Desktop/C%20Website/js/jquery-1.11.0.min 
Uncaught Error: Bootstrap's JavaScript requires jQuery 
+0

工作對我來說,如果我理解正確(http://jsfiddle.net/qEKcK/)。你確定你包含完整的CSS嗎?另外,控制檯中是否有任何錯誤?如果路徑不正確,您將看到404錯誤。我建議嘗試Bootstrap CDN來檢查這不是問題(http://www.bootstrapcdn.com/)。 – mtaube

+0

我添加了控制檯錯誤以及我的CSS的路徑。我首先嚐試了CDN路線並且無法使其工作? – Bacon2305

回答

1
<script src="js/jquery-1.11.0.min.js"></script> 

也許你應該添加 「的.js」 到src ...

1

只需添加其他建議...嘗試使用CDN託管版本的jQuery和Bootstrap。這將有助於路徑錯誤並提高速度。

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> 
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>