Question

Twitter Bootstrap http://twitter.github.com/bootstrap/javascript.html#dropdown有一个dropdown.js库（位于http://twitter.github.com/bootstrap/1.4.0/bootstrap-dropdown.js），它会将下面的“下拉列表”更改为“下拉列表”，这将打开下拉菜单。

我在本地网站上包含了js文件，但它没有打开或切换。我不知道是否必须添加一个额外的方法来告诉jquery文件选择哪个元素，或者，如果我只是给元素类“dropdown”，js应该没有任何其他工作。

我试图在Twitter Bootstrap演示中使用Firebug解决这个问题，但我对它没有经验。如果您知道如何使用它，请告诉我。谢谢。

我在Rails应用程序上使用它，但这不应该有所作为。它自动包含jquery，正如我所说，我添加了dropdown.js。我只是想知道我是否还要做更多的事情......

  <ul class="nav secondary-nav">
        <li class="dropdown">
          <a href="#" class="dropdown-toggle">Dropdown</a>
          <ul class="dropdown-menu">
            <li><a href="#">Secondary link</a></li>
            <li><a href="#">Something else here</a></li>
            <li class="divider"></li>
            <li><a href="#">Another link</a></li>
          </ul>
        </li>
      </ul>

Answer 1

根据文档

要快速向任何nav元素添加下拉功能，请使用data-dropdown属性。任何有效的引导程序下拉列表都将自动激活。

所以只需添加data-dropdown属性就可以了，它应该可以正常工作

  <li class="dropdown" data-dropdown="dropdown">
    <a href="#" class="dropdown-toggle">Dropdown</a>
    <ul class="dropdown-menu">
      <li><a href="#">Secondary link</a></li>
      <li><a href="#">Something else here</a></li>
      <li><a href="#">Another link</a></li>
    </ul>
  </li>

Answer 2

我会检查（使用firebug）你提供的链接给出的演示，并确保html结构准确。

如果您的html结构正确，并且所有相应的类/ ID都存在，那么请检查您是否正在实际初始化/加载脚本。您可以使用firebug或google chrome inspect执行此操作，方法是转到资源选项卡并查找引用的js文件。或者，转到控制台，如果有任何js加载错误，那么您没有正确调用文件。

你是否包括这一行？

$('#topbar').dropdown()

另外，给自己一个健全性检查：尝试检查jQuery是否正常工作。尝试使用firebug控制台来改变div背景颜色等。

Answer 3

丹尼尔的回答是正确的。该演示使用data-dropdown="dropdown"属性。查看第3行（或页面源中的第243行）。

您没有使用完整的脚本堆栈。检查您的包含。

dropdown.js可以访问吗？我知道你包括它，但检查你的浏览器是否实际加载它。路径正确吗？从源复制路径并尝试直接访问dropdown.js。也许告诉我们你在dropdown.js的方式和地点？
之后<{1}}包含 首先应包括您的主jQuery库，然后是dropdown.js，然后是rails.js等补充。

这是不太可能的，但您使用的是正确版本的jQuery吗？

或许向我们展示您的浏览器来源的完整包含输出？（Rails生成的所有dropdown.js和script标记）

实际上没有其他原因可以解决这个问题。

我怎样才能用jQuery切换它

3 个答案: