第一次尝试时不显示崩溃中的引导下拉列表 [英] Bootstrap dropdown in collapse not showing on first attempt
问题描述
我在nav-collapse中有一个下拉菜单。
I have a dropdown menu inside a nav-collapse.
当我减小窗口的宽度（例如：700px）时，navbar正确地折叠， btn-navbar解开它，然后我点击下拉列表，但它不下拉，菜单不显示。
When I reduce the window's width (eg: 700px), the navbar correctly collapses, then I click on btn-navbar to un-collapse it, then I click on the dropdown, but it does not drop down, the menu does not show. If then I collapse and un-collapse again, the dropdown starts working.
当窗口的宽度从一开始就很小时，也会发生同样的情况。
The same happens when the window's width is small from the beginning.
这就像折叠部分的高度固定在开头，它不会让下拉框做它的事情。
It's like the height of the collapsed part was fixed at the beginning, and it doesn't let the dropdown do its thing.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap-responsive.css" />
<script src="js/jquery.js"></script>
<script src="js/bootstrap.js"></script>
</head>
<body>
<div class="navbar">
<div class="navbar-inner">
<div class="container">
<!-- .btn-navbar is used as the toggle for collapsed navbar content -->
<button class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!-- Be sure to leave the brand out there if you want it shown -->
<a class="brand" href="#">Project name</a>
<!-- Everything you want hidden at 940px or less, place within here -->
<div class="nav-collapse">
<ul class="nav pull-right">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
Anonymous <b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li>
<a href=''><i class='icon-chevron-right'></i> Login</a>
</li>
<li>
<a href=''><i class='icon-plus'></i> Register</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</div>
</body>
</html>
Bootstrap v2.2.0
Bootstrap v2.2.0
Firefox 16.0 .2
Firefox 16.0.2
推荐答案
很多人都把这个问题报告为repo上的错误（例如：问题＃5671 ，问题＃5890 a>， Issue＃6019 ）。
A lot of people were reporting this as a bug on the repo (eg. Issue #5671, Issue #5890, Issue #6019).
在响应＃5671，有人指出根据响应式Navbar上的文档，当使用类 navbar-collapse ，还必须包括 collapse 。似乎你的例子受到这个相同（尽管很容易被忽视）的缺陷。
In response to #5671, someone points out that as per the docs on responsive Navbar, when using the class navbar-collapse you must also include collapse. Seems that your example suffers from this same (albeit easily overlooked) flaw.
下面是一个你的代码的工作示例，唯一的区别是添加 collapse class：
Here's a working example of your code, the only difference being adding the collapse class:
这篇关于第一次尝试时不显示崩溃中的引导下拉列表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
