Twitter Bootstrap：下拉菜單類不起作用

Question

我試圖從O'Reilly的Bootstrap書籍中查看以下樣本 的結果。我看過 這個主題的其他幾個帖子，但似乎沒有 解釋以下small example。似乎 下拉菜單類正在阻止從 無序列表中顯示，儘管我已經包含引導CSS和JS文件。

<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu"> 
    <li><a tabindex="-1" href="#">Action</a></li> 
    <li><a tabindex="-1" href="#">Another action</a></li> 
    <li><a tabindex="-1" href="#">Something else here</a></li> 
    <li class="divider"></li> 
    <li><a tabindex="-1" href="#">Separated link</a></li> 
</ul> 

從書下面的代碼示例也does not work in JSFiddle （按鈕顯示出來，但是當我點擊沒有菜單顯示）：

<!-- Single button --> 
<div class="btn-group"> 
    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> 
     Action <span class="caret"></span> 
    </button> 
    <ul class="dropdown-menu" role="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> 
</div> 

感謝。

Answer 1

您的代碼有效。確保你已經包含jquery，因爲下拉菜單要求它工作。

jQuery的

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 

jQuery用戶界面（如果你想的話）

<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" /> 
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script> 

這是另一種有效的下拉測試。

<div class="btn-group"> 
     <button class="btn btn-default">Action</button> <button data-toggle="dropdown" class="btn btn-default dropdown-toggle"><span class="caret"></span></button> 
     <ul class="dropdown-menu"> 
      <li><a href="#">Action</a></li> 
      <li class="disabled"><a href="#">Another action</a></li> 
      <li class="divider"></li> 
      <li><a href="#">Something else here</a></li> 
     </ul> 
    </div>