Pourquoi mon menu de navigation réduit Bootstrap 3 reste-t-il ouvert après avoir cliqué sur un lien ?

Le menu de navigation réduit de Bootstrap 3 reste ouvert au clic

Les menus de navigation de Bootstrap 3 disposent d'une fonction de réduction pratique pour les petits appareils. Cependant, le menu reste parfois ouvert après avoir cliqué sur un lien de menu. Cela peut être frustrant si vous souhaitez que le menu se ferme après avoir sélectionné un élément.

Le code ci-dessous, qui était une solution populaire sur GitHub, résout ce problème :

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

Ce code lie un écouteur d'événements pour le document, qui écoute les clics sur n'importe quel élément dans la barre de navigation développée. Si l'élément cliqué est un élément d'ancrage, il réduit le menu.

Pour résoudre les problèmes liés aux sous-menus, le code a été modifié comme suit :

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

Cela garantit que le menu uniquement s'effondre lorsque l'élément cliqué est un lien direct, pas une bascule déroulante.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!