我有一个包含标签和按钮的下拉列表。我希望能够在没有下拉关闭的情况下单击选项卡,但如果我单击一个按钮,它将关闭。
我使用$ event.stopPropagation()来停止关闭,但显然这会阻止按钮关闭它。
有办法做到这一点吗?
答案 0 :(得分:10)
默认情况下,如果单击任何元素,下拉列表将自动关闭,您可以通过设置自动关闭选项来更改此行为,如下所示:
always
- (默认)会在点击任何元素时自动关闭下拉列表。
outsideClick
- 仅在用户点击下拉列表外的任何元素时自动关闭下拉列表。
disabled
- 禁用自动关闭。然后,您可以使用is-open
手动控制下拉列表的打开/关闭状态。请注意,如果单击切换按钮,按下esc键或打开另一个下拉列表,下拉列表仍会关闭。
以下是一个示例:Plunker
<div class="btn-group" dropdown auto-close="disabled">
<button type="button" class="btn btn-danger">Action</button>
<button type="button" class="btn btn-danger dropdown-toggle" dropdown-toggle>
<span class="caret"></span>
<span class="sr-only">Split button!</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>