我在网页上使用了Twitter Bootstrap导航栏下拉列表。设计是在选择(单击)下拉菜单项时打开新网页。
我遇到的问题是,打开新网页时,下拉菜单不会被忽略。
如何以编程方式关闭下拉菜单?
以下是我的网页设计:
<script type="text/javascript">
$(document).ready(function () {
$('.dropdown-toggle').dropdown();
$('a.pagelink').click(function(e) {
window.open(this.href);
return false;
});
});
</script>
<body>
<div class="navbar">
<div class="navbar-inner">
<div class="container">
<ul class="nav">
<li class="dropdown" id="accountmenu">
<a class="dropdown-toggle" data-toggle="dropdown" href="./Bootstrap dropdown with navbar example_files/Bootstrap dropdown with navbar example.htm">Websites<b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a class="pagelink" href="http://cnn.com">CNN</a></li>
<li class="divider"></li>
<li><a class="pagelink" href="http://www.yahoo.com">Yahoo</a></li>
</ul>
</li>
</ul>
</div>
</div>
</div>
<div class="container-fluid">
<h1>Dropdown Example</h1>
</div>
</body>
答案 0 :(得分:0)
为什么你需要Jquery呢? Bootstrap已经具备了所有这些功能。
只需在target="_blank"
标记中添加<a>
即可。单击这些按钮时,下拉列表将自动关闭。
例如:
<ul class="dropdown-menu">
<li><a class="pagelink" href="http://cnn.com" target="_blank">CNN</a></li>
<li class="divider"></li>
<li><a class="pagelink" href="http://www.yahoo.com" target="_blank">Yahoo</a></li>
</ul>