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

Why Does My Bootstrap 3 Collapsed Navigation Menu Stay Open After Clicking a Link?

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!

Déclaration
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
LETS & # 039; S un magasin de commerce électronique Jamstack avec des fonctions NetlifyLETS & # 039; S un magasin de commerce électronique Jamstack avec des fonctions NetlifyApr 17, 2025 am 10:13 AM

Beaucoup de gens sont confus quant à ce qu'est Jamstack. L'acronyme signifie JavaScript, API et Marquage, mais vraiment, Jamstack n'a pas à inclure tous

Élément de rebond autour de la fenêtre dans CSSÉlément de rebond autour de la fenêtre dans CSSApr 17, 2025 am 10:12 AM

Laissez dire que vous alliez faire rebondir un élément tout autour d'un écran, un peu comme un économiseur d'écran ou un pong de la vieille école ou quelque chose.

Comment contribuer à un projet open sourceComment contribuer à un projet open sourceApr 17, 2025 am 10:10 AM

Ce qui suit va devenir un peu d'opinion et vise à guider quelqu'un dans son voyage vers l'open source. En tant que condition préalable, vous devriez avoir de base

Navbar poussant sur @keyframersNavbar poussant sur @keyframersApr 17, 2025 am 10:09 AM

L'autre jour, je suis devenu l'invité vedette sur les fraises clés. Nous avons regardé un Dribbble tourné par Björgvin Pétur Sigurjónsson, puis l'avons construit lentement,

Vulnérabilités de sécurité CSSVulnérabilités de sécurité CSSApr 17, 2025 am 10:02 AM

Ne lisez pas ce titre et ne vous inquiétez pas. Je ne pense pas que CSS soit une préoccupation de sécurité particulièrement dangereuse et, pour la plupart, je ne pense pas que vous ayez besoin de

D'autres façons de spasD'autres façons de spasApr 17, 2025 am 10:01 AM

Ce lolz rimé.

Aller à la créationAller à la créationApr 17, 2025 am 10:00 AM

Je & # 039; m dans une relation longue distance. Cela signifie que je suis dans un avion pour l'Angleterre toutes les quelques semaines, et chaque fois que je suis dans cet avion, je pense à quel point il serait sympa

See all articles

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques moisBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
1 Il y a quelques moisBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
1 Il y a quelques moisBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Commandes de chat et comment les utiliser
1 Il y a quelques moisBy尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

Navigateur d'examen sécurisé

Navigateur d'examen sécurisé

Safe Exam Browser est un environnement de navigation sécurisé permettant de passer des examens en ligne en toute sécurité. Ce logiciel transforme n'importe quel ordinateur en poste de travail sécurisé. Il contrôle l'accès à n'importe quel utilitaire et empêche les étudiants d'utiliser des ressources non autorisées.

Version Mac de WebStorm

Version Mac de WebStorm

Outils de développement JavaScript utiles

mPDF

mPDF

mPDF est une bibliothèque PHP qui peut générer des fichiers PDF à partir de HTML encodé en UTF-8. L'auteur original, Ian Back, a écrit mPDF pour générer des fichiers PDF « à la volée » depuis son site Web et gérer différentes langues. Il est plus lent et produit des fichiers plus volumineux lors de l'utilisation de polices Unicode que les scripts originaux comme HTML2FPDF, mais prend en charge les styles CSS, etc. et présente de nombreuses améliorations. Prend en charge presque toutes les langues, y compris RTL (arabe et hébreu) ​​et CJK (chinois, japonais et coréen). Prend en charge les éléments imbriqués au niveau du bloc (tels que P, DIV),