我希望在用户单击菜单外部(而不仅仅是导航栏元素外部)时关闭菜单。因为菜单中有更多折叠,所以此解决方案不适用于我:How to close an open collapsed navbar when clicking outside of the navbar element in Bootstrap 3?当我在菜单外单击时菜单消失,但当我单击带有下拉菜单的链接时,整个菜单折叠。
<div class="collapse navbar-collapse nav-mobile" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="list-group panel">
<a href="#submenu-1" class="list-group-item" data-toggle="collapse" data-parent="#MainMenu">Webshop</a>
<ul class="collapse" id="submenu-1">
<a href="#SubMenu1" class="list-group-item" data-toggle="collapse" data-parent="#SubMenu1">Industriële verpakkingen</a>
<a href="javascript:;" class="list-group-item">Promotionele verpakkingen</a>
<a href="javascript:;" class="list-group-item">Gelamineerde verpakkingen</a>
<a href="javascript:;" class="list-group-item">Enveloppen &verzend verpakkingen</a>
<a href="javascript:;" class="list-group-item">Medische verpakkingen</a>
<a href="javascript:;" class="list-group-item">Co-packing</a>
</ul>
</li>
</ul>
3条答案
按热度按时间ttcibm8c1#
如果未单击链接,则可以使用此选项折叠:******
k2fxgqgv2#
另一种选择是,您可以添加以下代码:
另一个例子:dtc-eng
bwitn5fc3#
以下是我的看法:
此解决方案可处理:
.navbar-toggle
元素(可以是<buttons>
或<a>
,它处理潜在内部元素(如<span>
或<strong>
等)上的点击)。<a>
元素上(同样,它处理内部元素上的点击)。.navbar
)之外。.collapse
)元素(与它们在DOM中的位置不明显)。您可以定制传递给jQuery的大多数选择器(
document
,.collapse
,.navbar
等)来满足您的需要,甚至可以添加更多的条件。