Keep-bootstrap-3-dropdown-open-when-Click

Question

我需要幫助實現與以下鏈接相同的導航。

它有我的代碼以及客戶的要求。而我使用的引導3

Bootstrap Dropdowns - dropdown.js 

jsfiddle Link

請幫助。

Answer 1

Updated fiddle

你需要做只有一個變化：

而是聽hide.bs.dropdown事件僅.dropdown.active 的適用事件處理程序.dropdown。

基本上變化：

$(".dropdown.active").on("hide.bs.dropdown",function(e) {

到：

$(".dropdown").on("hide.bs.dropdown",function(e) {

---

編輯： 爲了覆蓋默認的下拉列表的行爲，你需要忽略active狀態因此不止一個li元素可以保持展開狀態，您需要自行切換可見性。

Here's the updated demo

代碼：

$(function(){ 

    // Handle show/hide toggle yourself 
    $(".dropdown").on("click",function(e) { 
     if($(e.currentTarget).hasClass("open")) 
      $(e.currentTarget).toggleClass("open",false); 
     else 
      $(e.currentTarget).toggleClass("open",true); 
     e.preventDefault(); 
     return false; 
    }); 

    // suppressing default bahavior 
    $(".dropdown").on("hide.bs.dropdown", doNothing);    
    $(".dropdown").on("show.bs.dropdown", doNothing); 

    function doNothing(e) { 
     e.preventDefault(); 
     return false; 
    } 
}); 

Answer 2

不知道它的正確方法，但我沒有

$(function(){ 
    $('.nav').find('li.dropdown.active').addClass('open'); 
    $(".dropdown").on("hide.bs.dropdown",function(e) { 
     e.preventDefault(); 
     return false; 
    }); 
    $('.navbar-main li').on('click', function(){ 
    var me = $(this); 
    $('.navbar-main li').removeClass('open'); 
    $(this).addClass('open'); 
    }); 
}); 

及其工作的幫助精細:)