首頁 >web前端 >css教學 >為什麼我的 Bootstrap 3 折疊選單在點擊連結後仍保持開啟?

為什麼我的 Bootstrap 3 折疊選單在點擊連結後仍保持開啟?

Patricia Arquette
Patricia Arquette原創
2024-11-14 10:51:02707瀏覽

Why Does My Bootstrap 3 Collapsed Menu Stay Open After Clicking a Link?

Bootstrap 3:解決持續存在的折疊選單問題

問題:

在 Bootstrap 3在導覽中,折疊選單點擊選單連結後保持開啟狀態,擾亂使用者

答案:

要解決此問題,請實作以下程式碼:

$(document).on('click','.navbar-collapse.in',function(e) {
    if( $(e.target).is('a') ) {
        $(this).collapse('hide');
    }
});

詳細資料:

  • 此解決方案將事件偵聽器綁定到文件以監視其中的點擊展開的導航選單(類別:“.navbar-collapse.in”)。
  • 當點選選單連結(「a」元素)時,行 $(this).collapse('hide' );觸發導覽功能表的摺疊。

更新[2014-11-04]:

  • 對於帶有子選單的導航,修改程式碼為:
$(document).on('click','.navbar-collapse.in',function(e) {
    if( $(e.target).is('a:not(".dropdown-toggle")') ) {
        $(this).collapse('hide');
    }
});
  • 此修改可確保只有不是下拉式選單切換的選單連結才會觸發選單折疊。

以上是為什麼我的 Bootstrap 3 折疊選單在點擊連結後仍保持開啟?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn