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'); 
    }); 
}); 

及其工作的帮助精细:)