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>