dcm*_*ody 11 jquery prototypejs twitter-bootstrap twitter-bootstrap-3
我有一个应用程序,我正在慢慢转换为jQuery并且也将使用Bootstrap.
但是,使用Bootstrap 3时,单击下拉菜单后,菜单会正确显示.然而,在单击菜单或"关闭"菜单后.按钮/链接完全消失,直到页面刷新后才会重新出现.
与此相同:https://github.com/twbs/bootstrap/issues/8379
上面的链接说要联系谷歌组,但我没有在组中看到任何关于此的请求.
任何帮助将不胜感激!
谢谢, - 大卫
所以使用@ GeekNum88的指导,如果你注释掉这些行,下拉列表就可以了,不确定它的总效果:
function clearMenus() {
$(backdrop).remove()
$(toggle).each(function (e) {
var $parent = getParent($(this))
if (!$parent.hasClass('open')) return
// $parent.trigger(e = $.Event('hide.bs.dropdown'))
// if (e.isDefaultPrevented()) return
$parent.removeClass('open').trigger('hidden.bs.dropdown')
})
}
Run Code Online (Sandbox Code Playgroud)
小智 2
实现 Bootstrap 下拉菜单是一项非常简单的任务。请参阅Bootstrap 文档中的示例并按照以下步骤操作:
1. 在标题标签正下方的头标签之间包含以下库
确保 jQuery 库在 Boostrap JS 库之前加载。
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
Run Code Online (Sandbox Code Playgroud)
2. 将以下 HTML 粘贴到body标记之间
<div class="btn-group">
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
Action <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</div>
Run Code Online (Sandbox Code Playgroud)
工作示例:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Bootstrap Dropdown</title>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
</head>
<body>
<div class="btn-group">
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
Action <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
要证明它有效,请参阅 fiddle。