Question

所以我试图让Twitter Bootstrap的导航栏中的下拉列表工作，我遇到了一些问题。

这是我的html：

<ul class="nav">
  <li class="active"><%= link_to 'Home', root_path %></li>
  <li><a href="#">Forums</a></li>
  <li class="dropdown">
    <a href="#" class="dropdown-toggle" data-toggle="dropdown">World</a>
    <ul class="dropdown-menu">
      <li><%= link_to 'Current', current_path %></li>
      <li><%= link_to 'All', all_path %></li>
    </ul>
  </li>
</ul>

我也在<head>：

中有这个

<script type="text/javascript" src="http://twitter.github.com/bootstrap/assets/js/bootstrap-dropdown.js"></script>

它只是不起作用，任何人都可以看到它有什么问题吗？

Answer 1

您指的是错误的JS文件。

使用以下内容代替您使用的<script>标记：

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">

<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>

您可以阅读here

在<ul>班级定义中，添加您想要使用的相关nav：

<ul class="nav nav-tabs">

----------------------------- ^^

或 <ul class="nav nav-pills">

你也可以根据你的评论直接链接到bootstrap-dropdown.js，但是你需要包含bootstrap css和js（我还更新了小提琴）： https://netdna.bootstrapcdn.com/twitter-bootstrap/2.0.4/js/bootstrap-dropdown.js

请参阅fiddle

另外 - 我看到你使用RoR，所以确保它不是缺少JS文件的RoR问题。

Answer 2

我遇到了与bootstrap下拉相同的问题（在rails中）。我通过从application.js中删除 // = require_tree。 来解决了这个问题。并且得到了工作。

Answer 3

将您的jquery主文件更新为1.11.0 并且只使用bootstrap.min.js bootstrap.min.css and jquery main file

Bootstrap导航栏下拉列表无法正常工作

3 个答案: