避免必須雙擊切換引導程序下拉菜單

我正在使用引導程序下拉菜單。問題在於，它在第一次點擊時從不下降;我需要點擊2次才能切換。我猜這個點擊事件在某種程度上在傳播之前就被卡住了...避免必須雙擊切換引導程序下拉菜單

有什麼辦法解決這個問題嗎？

2014-06-14 Jago

提供了一個演示代碼來理解問題。你可以使用[http://jsfiddle.net/](http://jsfiddle.net/） – tejashsoni111

，也有需要兩次點擊。

<li class="dropdown"> 
    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a> 
    [...] 
</li>

=>刪除data-toggle="dropdown"將解決此問題。

在此之後單擊打開下拉菜單。

參考： https://github.com/angular-ui/bootstrap/issues/2294

來源

2014-08-15 07:42:01 minni

完美地工作，謝謝你的頭！ –

這就是贏家！ –

哇！我有完全相同的問題！我正在使用ui-bootstrap和角度。作品非常瞭解..感謝分享！ – user1322092

發生這種情況是因爲其下拉菜單的Twitter Bootstrap語法包含href標記。您需要preventDefault和stopPropagation以防止發生這種情況。這樣的事情會做的伎倆：如果有人與正常的引導HTML下拉定義一起使用的角度與ui-bootstrap模塊

$('.dropdown-toggle').click(function(e) { 
    e.preventDefault(); 
    e.stopPropagation(); 

    return false; 
});

來源

2014-06-18 22:50:50 rdougan

完美！但是，我不知何故驚訝他們不包括在他們的引導js文件中。 – Jago

我猜測，只使用Bootstrap時，使用href是預期的行爲。但是，當使用Angular時，你不想使用它。雖然這很糟糕。 – rdougan

通過angular.ui.bootstrap的源代碼，他們有下拉菜單既處理本地bootstrap.js內尋找。

建議的解決方案： adjust angular.ui.bootstrap dropdownToggle指令僅限制爲「A」屬性。所以通過解決此問題，您需要修改dropdownToggle將「CA」限制爲「A」，這將從angular.ui.bootstrap中隱藏Class looker，它已經由bootstrap.js處理，用於縮小角度的版本。（「dropdownToggle」，function（）{return {restrict：「CA」，require：「？^ dropdown」，link：function（a，b，c，d）{

取代「CA」與「A」。

乾杯

來源

2014-11-17 04:22:17 Jomaf

我發現在一些頁面上，我不得不雙擊，其他頁面是單擊。

刪除data-toggle="dropdown"將雙擊變成單曲並打破單曲。

我比較了開發工具的HTML（因爲相同的HTML被送達）和我雙擊頁面發現與數據切換div是這樣的：

<div id="notifications" data-toggle="dropdown" class="dropdown-toggle" 
    aria-haspopup="true" aria-expanded="false">

但單一的點擊HTML看起來是這樣的：

<div id="notifications" data-toggle="dropdown" class="dropdown-toggle">

因此，文件準備，我用ATTR檢測和防止默認回答，這讓我雙擊打開成單一的點擊打開：

if (!($('#notifications').attr('aria-haspopup') == undefined && 
    $('#notifications').attr('aria-expanded') == undefined)) 
{ 
    $('.dropdown-toggle').click(function (e) { return false; }); 
}

來源

2014-12-03 18:00:42 jaybro

我在https://stackoverflow.com/a/27278529/1673289中遇到了與jaybro相同的問題，但是他們的解決方案沒有幫助。

定爲這兩種情況的方式是添加：

data-disabled="true"

在其上具有data-toggle="dropdown"屬性的元素。

來源

2015-02-19 15:46:46 JoshSub

避免必須雙擊切換引導程序下拉菜單

回答

相關問題