如何在外部點擊時關閉引導導覽列？

使用Bootstrap 在外部點擊時關閉開啟的導覽列

在Bootstrap 3 中使用折疊的導覽列時，能夠關閉非常有用點擊導覽列區域外部即可。為此，您可以使用以下 JavaScript 程式碼：

$(document).ready(function () {
    $(document).click(function (event) {
        var clickover = $(event.target);
        var _opened = $(".navbar-collapse").hasClass("navbar-collapse in");
        if (_opened === true && !clickover.hasClass("navbar-toggle")) {
            $("button.navbar-toggle").click();
        }
    });
});

此程式碼監視所有文件點擊。當它偵測到導覽列元素外部的點擊（由 clickover 變數決定）時，它會檢查導覽列目前是否開啟 (_opened)。如果導覽列開啟且按一下的元素不是「導覽列切換」按鈕，則會觸發切換按鈕的單擊，從而有效地關閉導覽列。

您提供的程式碼片段不起作用，因為它確實有效在嘗試關閉導覽列之前不檢查導覽列是否已開啟。此外，它使用 jQuery('.navbar').click(...)，它也會在導覽列中點擊時觸發，從而防止外部點擊將其關閉。

透過利用 中提供的修改後的程式碼答案是，您可以確保開啟的導覽列在您按一下其外部時關閉，從而增強使用者體驗和導覽流程。

以上是如何在外部點擊時關閉引導導覽列？的詳細內容。更多資訊請關注PHP中文網其他相關文章！