Bootstrap導航欄摺疊 - 如何通過點擊關閉

我想這是一個菜鳥問題。我希望Bootstrap「navbar-collapse」通過點擊或單擊其中一個列表項來關閉。我發現這個代碼的地方，它的作品。Bootstrap導航欄摺疊 - 如何通過點擊關閉

$(document).on('click',function() { 
    $('.collapse').collapse('hide'); 
});

但是，這段代碼還使Bootstrap「panel-collapse」元素靠近點擊離開，當然我不希望發生這種情況。

如何指定我希望此代碼僅適用於「navbar-collapse」元素？

來源

2016-07-27 ozone

讓您的導航欄崩潰元素的新類和內部分配給它：您添加類導航欄崩潰元素，而無需去除老班

$('.NewClassName').collapse('hide');

注意。

來源

2016-07-27 13:06:13

謝謝。即使使用標準的Bootstrap類「navbar-collapse」，你的代碼也可以工作。我以前用錯了。 – ozone

你的代碼是正確的。

上面顯示了一個奇怪的行爲，我有時滾動條會出現在導航欄上。這可能來自一些奇特的CSS，但下面爲我固定它。

$(document).on('click',function(e){ 
    if($('#navbar-collapse').hasClass('in')){ 
    $('.collapse').collapse('hide'); 
    } 
})

此外，請確保你在你的文件有

<script src="/js/bootstrap.min.js"></script>

。

來源

2016-07-27 13:07:25

檢查您是否在導航欄外單擊。摺疊方法可預期地使用我們的參考導航欄

$(document).click(function (event) { 
    var target = $(event.target); 
    var $navbar = $(".navbar-collapse");    
    var opened = $navbar.hasClass("in"); 
    if (opened === true && !target.hasClass("navbar-toggle")) {  
     $navbar.collapse('hide'); 
    } 
});

來源

2016-07-27 13:07:53

如果您使用的是引導navbar類被解僱，你可以簡單地做：

$('.navbar .collapse').collapse('hide');

這將隱藏所有崩潰元件，其子女的navbar類。

來源

2016-07-27 13:08:10

Bootstrap導航欄摺疊 - 如何通過點擊關閉

回答

相關問題