Wie schließe ich eine in Bootstrap 3 reduzierte Navigationsleiste bei einem Klick von außen?

Reduzierte Navigationsleiste bei Klick außerhalb schließen

Um eine reduzierte Navigationsleiste zu schließen, wenn Sie in Bootstrap 3 außerhalb des angegebenen Bereichs klicken, kann die folgende Lösung sein implementiert:

Die Aufgabe besteht darin, einen Mechanismus zu etablieren, der Benutzerklicks über das Navigationsleistenelement hinaus erkennt und das Schließen der Navigationsleiste auslöst. Der erste Versuch mit jQuery(document).click(function()) und jQuery('.navbar').click(function()) hat dieses Ziel nicht erreicht.

Ein modifizierter Ansatz beinhaltet ein Klickereignis Listener für das Dokumentelement:

$(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();
        }
    });
});

In diesem Code bestimmt Clickover das Element, in dem der Klick stattgefunden hat. _opened stellt fest, ob die Navigationsleiste derzeit reduziert und geöffnet ist. Wenn dann die Navigationsleiste geöffnet ist und der Klick außerhalb der Umschalttaste erfolgt ist, wird die Schaltfläche programmgesteuert angeklickt, wodurch das Schließen der Navigationsleiste ausgelöst wird.

Diese Lösung implementiert eine reibungslose Reduzieranimation und stoppt die Weitergabe des Klickereignisses an die zugrunde liegende Elemente, um sicherzustellen, dass die Navigationsleiste geschlossen wird, wenn Sie außerhalb ihrer Grenzen klicken.

Das obige ist der detaillierte Inhalt vonWie schließe ich eine in Bootstrap 3 reduzierte Navigationsleiste bei einem Klick von außen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!