web-dev-qa-db-fra.com

Comment masquer Bootstrap modal précédent lorsque vous en ouvrez un nouveau?

J'ai un tel problème: j'ai une authentification qui est faite en utilisant Bootstrap modals.

Lorsque l'utilisateur ouvre la connexion en modal, il peut aller s'inscrire en modal (ou autre). Donc, je dois fermer le précédent.

Maintenant, je les ferme comme ceci:

$(document).ready(function(){
  $("a").click(function() {
  $("#login").hide();
  $("#sign_up").hide();
 })  
});

mais quand je fais cela - je ne peux pas rouvrir la connexion en modal (après avoir cliqué sur s'inscrire depuis la connexion) jusqu'à ce que je rafraîchisse la page.

Quelqu'un peut-il suggérer comment vérifier sur quel modal je clique sur le lien et le fermer, quand j'en appelle un autre? Existe-t-il un moyen universel de fermer le modal précédent?

24
MID

Vous cachez Bootstrap modaux avec:

$('#modal').modal('hide');

Dire $().hide() rend l'élément apparié invisible, mais en ce qui concerne le code modal, il est toujours là. Voir la section Méthodes dans la documentation Modals .

61
willglynn

Basculer les deux modaux

$('#modalOne').modal('toggle');
$('#modalTwo').modal('toggle');
2
Vikash Kumar

Le mieux que j'ai pu faire est

$(this).closest('.modal').modal('toggle');

Cela obtient le modal contenant l'objet DOM sur lequel vous avez déclenché l'événement (en supposant que vous cliquez sur un bouton). Obtient le parent le plus proche ".modal" et le bascule. Évidemment, cela ne fonctionne que parce que c'est à l'intérieur du modal sur lequel vous avez cliqué.

Vous pouvez cependant faire ceci:

$(".modal:visible").modal('toggle');

Cela obtient le modal qui s'affiche (car vous ne pouvez en ouvrir qu'un seul à la fois) et déclenche le basculement. Cela ne fonctionnerait pas sans ": visible"

1
TolMera