Bootstrap with dropdown menu

我正在使用bootstrap爲下拉菜單編寫簡單的代碼，代碼看起來很好。但是，當我點擊插入符時它不會擴展。我不確定發生了什麼問題。有人可以幫我弄這個嗎？謝謝您的幫助。Bootstrap with dropdown menu

<!DOCTYPE html> 
 
<html lang="en"> 
 
\t <head> 
 
\t \t <title>thenewboston</title> 
 
\t \t <meta charset="utf-8"> 
 
\t \t <meta name="viewpoint" content="width=device-width, initial-scale=1"> 
 
\t \t <!-- Latest compiled and minified CSS --> 
 
\t \t <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 
 
\t \t 
 
\t \t <!-- Optional theme --> 
 
\t \t <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous"> 
 
\t \t 
 
\t \t <!-- Latest compiled and minified JavaScript --> 
 
\t \t <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 
 
\t </head> 
 
\t 
 
\t <body> 
 
\t \t <nav class="navbar navbar-inverse"> 
 
\t \t \t <div class="container-fluid"> 
 
\t \t \t \t 
 
\t \t \t \t <!-- Logo --> 
 
\t \t \t \t <div class="navbar-header"> 
 
\t \t \t \t \t <a href="navbar.html" class="navbar-brand">ABE TECHNOLOGY</a> 
 
\t \t \t \t </div> 
 
\t \t \t \t 
 
\t \t \t \t <!-- Menu Items --> 
 
\t \t \t \t <div> 
 
\t \t \t \t \t <ul class="nav navbar-nav"> 
 
\t \t \t \t \t \t <li class="active"><a href="#">Home</a></li> 
 
\t \t \t \t \t \t <li><a href="#">About</a></li> 
 
\t \t \t \t \t \t <li><a href="#">Contact</a></li> 
 
\t \t \t \t \t \t 
 
\t \t \t \t \t \t <!-- drop down menu --> 
 
\t \t \t \t \t \t <li class="dropdown"> 
 
\t \t \t \t \t \t \t <a href="#" class="dropdown-toggle" data-toggle="dropdown">My Profile <span class="caret"></span></a> 
 
\t \t \t \t \t \t \t <ul class="dropdown-menu"> 
 
\t \t \t \t \t \t \t \t <li><a href="#">Friends</a></li> 
 
\t \t \t \t \t \t \t \t <li><a href="#">Photos</a></li> 
 
\t \t \t \t \t \t \t \t <li><a href="#">Settings</a></li> 
 
\t \t \t \t \t \t \t </ul> 
 
\t \t \t \t \t \t </li> 
 
\t \t \t \t \t </ul> 
 
\t \t \t \t </div> 
 
\t \t \t </div> 
 
\t \t </nav> 
 
\t </body> 
 
</html> \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t

來源

2016-02-22 Hachiri

你嘗試加載jQuery插件，因爲我提到下面我的答案嗎？如果有幫助嗎？ – BigDropGR

我確實添加了jQuery，但是當我運行chrome或firefox時，它不起作用。但是，當我在jsfiddle.com上運行相同的代碼時，它工作得很好。 – Hachiri

哦，nvm。我用你的jQuery和縮小的JavaScript代碼，然後它的工作。 – Hachiri

那是因爲你不加載的jQuery插件！

你需要下載這個腳本：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

來源

2016-02-22 09:31:49 BigDropGR

爲Bootstraps javascript components，你將需要使用jQuery。

您必須在引導腳本之前包含jQuery 之前。最好的是，你在你的頁面的底部有兩個腳本，收盤</body>標籤像以前一樣的權利：

[...your html...] 

<!-- jQuery --> 
<script src="//code.jquery.com/jquery-1.12.0.min.js"></script> 

<!-- Latest compiled and minified JavaScript --> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 

</body> 
</html>

來源

2016-02-22 12:37:35

由於某些原因，您發送的jQuery不起作用，但@BigDropGR正常工作。感謝您的幫助。 – Hachiri

Bootstrap with dropdown menu

回答

相關問題