如何关闭按钮单击的引导程序下拉菜单？

我有一个引导下拉菜单，我打开并保持打开状态，同时我使用放置在其中的网格进行工作，当单击下拉区域外部时可以关闭下拉菜单，但是我想关闭它上一个按钮单击事件..如何关闭按钮单击的引导程序下拉菜单？

这里是我的下拉

<div class="dropdown"> 
    <button class="btn dropdown-toggle col-md-3" type="button" data-toggle="dropdown"> 
     Select Category 
     <span class="caret"></span> 
    </button> 
    <ul class="dropdown-menu col-md-7" onClick="event.stopPropagation();"> 
     <div id="MaterialGridList" style="height:440px;"></div> 
     <button type="button" id="btnFilter" class="btn btn-sm btn-success">Filter</button> 
    </ul> 
</div>

HTML，你可以在下拉菜单的onClick事件看，它保持打开状态。所以我想要做的就是关闭它在btnFilter点击事件上。任何想法的？

来源

2016-10-01 Chris

您可以使用具有内按钮.dropdown的toggle功能：

$('#btnFilter').click(function() { 
 
    $(this).parents('.dropdown').find('button.dropdown-toggle').dropdown('toggle') 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" /> 
 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<div class="dropdown"> 
 
    <button class="btn dropdown-toggle col-md-3" type="button" data-toggle="dropdown"> 
 
     Select Category 
 
     <span class="caret"></span> 
 
    </button> 
 
    <ul class="dropdown-menu col-md-7" onClick="event.stopPropagation();"> 
 
     <div id="MaterialGridList" style="height:440px;"></div> 
 
     <button type="button" id="btnFilter" class="btn btn-sm btn-success">Filter</button> 
 
    </ul> 
 
</div>

来源

2016-10-01 23:05:08 Dekel

这个工作，它关闭后，但它不会再次打开。同样的事情发生在你的片段中。任何想法会导致什么？它会与ul上的onClick事件有关吗？ – Chris

对不起，我没有注意到。回答更新:)现在它应该工作。 – Dekel

完美的作品，谢谢先生:) – Chris

如何关闭按钮单击的引导程序下拉菜单？

回答

相关问题