Warum bleibt mein minimiertes Bootstrap 3-Menü geöffnet, nachdem ich auf einen Link geklickt habe?

Bootstrap 3: Lösung des weiterhin bestehenden Problems mit dem reduzierten Menü

Problem:

In einer Bootstrap 3-Navigation das reduzierte Menü bleibt geöffnet, nachdem auf einen Menülink geklickt wurde, was den Benutzer stört Erfahrung.

Antwort:

Um dieses Problem zu beheben, implementieren Sie den folgenden Code:

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

Details:

• Diese Lösung bindet einen Ereignis-Listener an das Dokument, um Klicks im erweiterten Navigationsmenü zu überwachen (Klasse: „.navbar-collapse.in“).
• Wenn ein Klick auf einen Menülink („ein“ Element) erfolgt, wird die Zeile $(this).collapse('hide'); löst das Reduzieren des Navigationsmenüs aus.

Update [2014-11-04]:

• Für die Navigation mit Untermenüs ändern Sie den Code in :

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

• Diese Änderung stellt sicher, dass nur Menü-Links verfügbar sind, die keine Dropdown-Listen sind Umschalten löst das Einklappen des Menüs aus.

Das obige ist der detaillierte Inhalt vonWarum bleibt mein minimiertes Bootstrap 3-Menü geöffnet, nachdem ich auf einen Link geklickt habe?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!