2017-02-27 54 views
2

在單擊另一個按鈕時,有一些問題獲取引導按鈕下拉列表以切換(使列表項和下拉ul元素可見)。這是我迄今爲止似乎沒有用的(v3.3.7)。我想要「測試」按鈕另外切換「測試」按鈕下拉列表。使用另一個按鈕切換引導按鈕下拉列表

<div class="btn-group"> 
    <a id="test-dropdown-btn" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> 
     Test <span class="caret"></span> 
    </a> 
    <ul id="test-dropdown" class="dropdown-menu"> 
     <li><a href="#">test</a></li> 
    </ul> 
</div> 
<a id="test-btn" class="btn btn-default" onclick="$('#test-dropdown-btn').dropdown('toggle')">testing</a> 

回答

2

您可以使用自定義屬性data-target到按鈕組的目標,所以點擊任何元素之外將觸發滴點放在目標按鈕組上。

<a id="test-btn" class="btn btn-default" data-toggle="dropdown" data-target=".btn-group"> 
testing</a> 

你應該給你的按鈕組一個ID,以便data-target更具體。

Demo

+1

太棒了。謝謝 – darrenc

0

嘗試的.toggle('dropdown')代替.dropdown('toggle')

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="btn-group"> 
 
    <a id="test-dropdown-btn" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> 
 
     Test <span class="caret"></span> 
 
    </a> 
 
    <ul id="test-dropdown" class="dropdown-menu"> 
 
     <li><a href="#">test</a></li> 
 
    </ul> 
 
</div> 
 
<a id="test-btn" class="btn btn-default" onclick="$('#test-dropdown-btn').toggle('dropdown')">testing</a>

+0

這使得整個下拉按鈕切換關閉,因此它是不可見的。我正在考慮讓實際的ul下拉菜單出現。 – darrenc