Question

我已经检查了我的javascript文件，我认为我拥有所有正确的文件。但我没有得到任何东西下拉。

<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/css/bootstrap-combined.min.css" rel="stylesheet">
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/js/bootstrap.min.js"></script>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-dropdown.js"></script>

...
        <div class="span3"><center>       
        <a href="#" class="btn btn-success dropdown-toggle" data-toggle="dropdown">Buy A Contract</a>
        <ul class="dropdown-menu">
            <li><a href="#">Hello World</a></li>
            <li><a href="#">Why am I not seeing this?</a></li>

        </ul>
        </div>

        </center>
        </div>
...

Answer 1

看起来像一个明显的问题：没有jQuery引用。此外，由于你包含了这个：

<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/js/bootstrap.min.js"></script>

您不需要引用bootstrap-dropdown.js（最小文件包含所有插件）。

修改

要明确的是，你需要在Bootstrap引用之前的某个地方有一个指向jQuery库副本的脚本标记，所以你的头应该类似于：

<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/css/bootstrap-combined.min.css" rel="stylesheet"> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/js/bootstrap.min.js"></script>

您可能需要支持jQuery版本，因为您要链接到旧版本的Bootstrap。如果您从Bootstrap源获得错误，请将jQuery版本更改为1.8.3。

Answer 2

在页面上的每个其他脚本之前声明Jquery非常重要。在标题中，在每个脚本之前插入以下行。：

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

但是您也有错误的语法来创建下拉菜单。它必须如下所示：

        <ul class="nav">
           <li><a href="#">Link</a></li>  
            <li><a href="#">Link</a></li>
             <li class="dropdown"> <!-- this is the item where your dropdown menu will popup-->
             <a data-toggle="dropdown" class="dropdown-toggle" href="#">Dropdown <b class="caret"></b></a>

        <ul class="dropdown-menu"><!-- your drop-down -menu-->
            <li><a href="#">nav1</a>
            </li>
            <li><a href="#">nav2</a>
            </li>
         </ul><!-- dropdown menu ends-->
      </li><!-- li with dropdown ends-->
  </ul><!-- Main nav ends-->

无法获得bootstraps下拉列表

2 个答案: