单击页面上的其他位置后,如何隐藏引导程序打开的折叠菜单 [英] How to hide a bootstrap opened collapsed menu after clicking elsewhere on page
本文介绍了单击页面上的其他位置后,如何隐藏引导程序打开的折叠菜单的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在开发一个引导模板,当有人点击菜单以外的时候,我需要隐藏/关闭打开的折叠菜单。这里有一个菜单的图像 http://dev.flutechs.com/menu.png
I'm working on a bootstrap template and i need to hide/close an opened collapsed menu when someone clicks outside the menu. Here an image of the menu http://dev.flutechs.com/menu.png
谢谢
推荐答案
这取决于折叠菜单创建。
It depends on how the "collapsed menu" is being created.
如果您使用标准的Bootstrap下拉菜单,则会在文档中的其他位置单击时自动关闭...
If you use the standard Bootstrap dropdown menu, it will automatically close when elsewhere in the document is clicked...
<div class="btn-group">
<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
Menu
<span class="caret"></span>
</a>
<ul class="dropdown-menu">
<li><a href="#">Choice1</a></li>
<li><a href="#">Choice2</a></li>
<li><a href="#">Choice3</a></li>
<li class="divider"></li>
<li><a href="#">Choice..</a></li>
</ul>
</div>
如果您使用 collapse
您可以使用jQuery创建文档单击
处理程序。
If you're using the collapse
component, you can create a document click
handler using jQuery..
$(document).on('click',function(){
$('.collapse').collapse('hide');
})
这篇关于单击页面上的其他位置后,如何隐藏引导程序打开的折叠菜单的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文