Twitter Bootstrap下拉菜单 - onclick将'open'类放在祖先ul而不是child ul上

时间:2012-04-16 22:58:00

标签: javascript twitter-bootstrap drop-down-menu

这是我的问题,我正在尝试通过Twitter引导程序更新帮助朋友 - 特别是导航栏。 当我点击具有下拉菜单的项目时,菜单无法打开。

我的问题是下拉菜单无法打开。我的调查显示bootstrap的javascript正在将open类应用于错误的ul,因此永远不会出现下拉。

我已按照http://twitter.github.com/bootstrap/javascript.html#dropdowns上的说明进行设置。据我所知,这一切都是正确的。

我已经导出了一个自定义引导程序,其中包含下拉列表。

页面在javascript控制台中运行时没有错误。

从我的调查中,我发现当你点击“打印”(有一个下拉列表)时,它实际上会转到ul.level-0.nav并添加“打开”类。这是一个问题,因为它实际上需要将该类应用于a.dropdown-menu。

请参阅此处的结构:

ul.level-0.nav
   li.dropdown
       a.dropdown-toggle
       ul.dropdown-menu

所以要复制问题,

第1步:Chrome中的http://jsfiddle.net/uGGgS/1/

第2步:打开你的chrome对象检查器(如果你在firefox中,或者如果你在IE中,那么请打开firebug,然后下载chrome并自己使用IE浏览器)

第3步:深入研究li.haschild.dropdown a:contains('print')

步骤4:单击“打印”菜单项,注意ul.level-0.nav现在具有“打开”类。另请注意,没有显示下拉菜单:(

第5步:将类open添加到打印下方的ul.dropdown-toggle,并注意下拉列表。

这里的任何人都知道我做错了什么?我在页面上做了一个w3c验证,它没有错误表明html页面有未封闭的标签。

感谢。

1 个答案:

答案 0 :(得分:2)

从我的测试中我发现文档中包含的bootstrap.min.js旧版本与您的标记冲突,并将其更新为最新修复此问题。