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

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
兩個圖像和一個API:我們重新著色產品所需的一切兩個圖像和一個API:我們重新著色產品所需的一切Apr 15, 2025 am 11:27 AM

我最近找到了一種動態更新任何產品圖像的顏色的解決方案。因此,只有一種產品之一,我們可以以不同的方式對其進行著色以顯示

每周平台新聞:第三方代碼,被動混合內容,連接最慢的國家的影響每周平台新聞:第三方代碼,被動混合內容,連接最慢的國家的影響Apr 15, 2025 am 11:19 AM

在本週的綜述中,燈塔在第三方腳本上闡明了燈光,不安全的資源將在安全站點上被阻止,許多國家連接速度

託管您自己的非JavaScript分析的選項託管您自己的非JavaScript分析的選項Apr 15, 2025 am 11:09 AM

有很多分析平台可幫助您跟踪網站上的訪問者和使用數據。也許最著名的是Google Analytics(廣泛使用)

它全部都在頭上:管理帶有React頭盔的React Power Site的文檔頭它全部都在頭上:管理帶有React頭盔的React Power Site的文檔頭Apr 15, 2025 am 11:01 AM

該文檔負責人可能不是網站上最迷人的部分,但是其中所處的內容對於您的網站的成功也一樣重要

JavaScript中的Super()是什麼?JavaScript中的Super()是什麼?Apr 15, 2025 am 10:59 AM

當您看到一些稱為super()的JavaScript時,在子類中,您會使用super()調用其父母的構造函數和超級。訪問它

比較不同類型的本機JavaScript彈出窗口比較不同類型的本機JavaScript彈出窗口Apr 15, 2025 am 10:48 AM

JavaScript具有各種內置彈出API,它們顯示用於用戶交互的特殊UI。著名:

為什麼可訪問的網站如此難以構建?為什麼可訪問的網站如此難以構建?Apr 15, 2025 am 10:45 AM

前幾天,我與一些前端人們聊天,講述了為什麼這麼多公司努力創建可訪問的網站。為什麼可訪問的網站如此艱難

'隱藏”屬性顯然很弱'隱藏”屬性顯然很弱Apr 15, 2025 am 10:43 AM

有一個HTML屬性,它可以正是您認為應該做的:

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
4 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
4 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您聽不到任何人,如何修復音頻
4 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.聊天命令以及如何使用它們
4 週前By尊渡假赌尊渡假赌尊渡假赌

熱工具

EditPlus 中文破解版

EditPlus 中文破解版

體積小,語法高亮,不支援程式碼提示功能

MantisBT

MantisBT

Mantis是一個易於部署的基於Web的缺陷追蹤工具,用於幫助產品缺陷追蹤。它需要PHP、MySQL和一個Web伺服器。請查看我們的演示和託管服務。

DVWA

DVWA

Damn Vulnerable Web App (DVWA) 是一個PHP/MySQL的Web應用程序,非常容易受到攻擊。它的主要目標是成為安全專業人員在合法環境中測試自己的技能和工具的輔助工具,幫助Web開發人員更好地理解保護網路應用程式的過程,並幫助教師/學生在課堂環境中教授/學習Web應用程式安全性。 DVWA的目標是透過簡單直接的介面練習一些最常見的Web漏洞,難度各不相同。請注意,該軟體中

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

將Eclipse與SAP NetWeaver應用伺服器整合。

Atom編輯器mac版下載

Atom編輯器mac版下載

最受歡迎的的開源編輯器