Comment fermer une fenêtre modale bootstrap en utilisant jQuery?

JQuery est une bibliothèque JavaScript riche en fonctionnalités, facile et rapide qui aide à manipuler le document HTML dans la gestion des événements, la manipulation, l'animation et plus. Plus précisément, il peut être utilisé pour ajouter la fenêtre du modèle sur une page Web. Ce modèle est représenté comme une fenêtre contextuelle ou une boîte de dialogue affichée en haut de la fenêtre actuelle.

Ce message expliquera spécifiquement la procédure pour fermer une fenêtre modale bootstrap en utilisant jQuery.

Comment utiliser jQuery pour fermer une fenêtre modale bootstrap?

Nous élaborerons sur le sujet mentionné en couvrant les étapes suivantes:

• Étape 1: Créez une fenêtre modale bootstrap en html
• Étape 2: Fermez la fenêtre modale bootstrap en utilisant jQuery

Étape 1: Créez une fenêtre modale bootstrap en html

En utilisant les classes modales bootstrap, la fenêtre modale peut être créée efficacement:

• Tout d'abord, créez un élément de bouton qui déclenchera le modal dans bootstrap en utilisant les attributs de données "data-toggle" et "cible de données".
• Ensuite, faites la fenêtre modale en utilisant la classe "modal" et "disparaître".
• Le "dialogue modal","contenu modal","tête-à-tête","titres modaux","corps modal", et "footteur modal«Sont les classes qui sont implémentées dans le code mentionné ci-dessous pour établir une boîte de dialogue modale flexible:

Lancement du modal

Titre

-Hidden = "true"> ×

Bienvenue à Linuxhint!

Fermer
Sauvegarder

Étape 2: Fermez la fenêtre modale bootstrap en utilisant jQuery

Généralement, l'attribut de données «dissolution"Avec la valeur"modal"Est spécifié pour fermer la boîte de dialogue modale. Cet attribut est appliqué à l'élément bouton pour fermer la fenêtre.

Dans notre scénario, nous sommes intéressés à implémenter JQuery pour fermer la fenêtre contextuelle. Alors, discutons-en à l'aide de la mise en œuvre:

• Tout d'abord, incluez le «”Tag dans HTML.
• Spécifiez la fonction $ () qui renvoie l'ID de l'élément. Associez-le à l'événement Click et connectez-le avec la fonction qui invoquera sur Click.
• À l'intérieur de la fonction, mentionnez le code "$ ('# welcomemodal').modal ('hide')"Cela signifie que l'ID"accueillant"Va être caché en utilisant le"modal ('hide')" fonction:

Sortir

De cette façon, vous pouvez fermer une fenêtre modale bootstrap en utilisant jQuery.

Conclusion

Pour fermer une fenêtre modale bootstrap en utilisant jQuery, créez une fenêtre modale à l'aide des classes bootstrap. Implémentez la fonction jQuery "$ ()«Pour obtenir l'ID de l'élément, puis associer le«modal ('hide')”Fonction avec lui. Cet article a illustré comment implémenter jQuery pour fermer une fenêtre modale bootstrap.