web-dev-qa-db-fra.com

Bootstrap 3 Modal: comment vérifier si modal est ouvert ou fermé en utilisant jquery/javascript

Quelqu'un peut-il me dire comment vérifier le statut modal de bootstrap 3.0, est-il ouvert ou fermé à l'aide de jQuery ou javascript? J'ai utilisé le code suivant, mais cela fonctionne lorsque vous avez ouvert un modal pour une fois, sinon donne une erreur non définie de données.

if($('#addMemberModal').data('bs.modal').isShown == true){
console.log("Modal is open");
}
jquerytwitter-bootstrap-3
16
F Shahzad

Vous pouvez aussi utiliser straight jQuery comme ceci:

$('#myModal').is(':visible');
37
alexoviedo999

vous pouvez vous référer à leur page http://getbootstrap.com/javascript/#modals

$('#myModal').on('hidden.bs.modal', function (e) {
  // do something...
})

show.bs.modal
Cet événement se déclenche immédiatement lorsque la méthode show instance est appelée. Si causé par un clic, l'élément cliqué est disponible en tant que propriété relatedTarget de l'événement.

shown.bs.modal
Cet événement est déclenché lorsque l'utilisateur a rendu le modal visible (attend que les transitions CSS soient terminées). Si causé par un clic, l'élément cliqué est disponible en tant que propriété relatedTarget de l'événement.

hide.bs.modal
Cet événement est déclenché immédiatement lorsque la méthode d'instance de masquage a été appelée.

hidden.bs.modal Cet événement est déclenché lorsque le modal n'est plus masqué à l'utilisateur (attend que les transitions CSS se terminent) . Load.bs.modal Cet événement est déclenché lorsque modal a chargé le contenu à l'aide de l'option remote.

22
Se0ng11

essayez de vérifier:

if($("#addMemberModal").data('modal') && $("#addMemberModal").data('modal').isShown ) {
    console.log("Modal is open");
}

ou

if( $('#addMemberModal').hasClass('in') ) {
    console.log("Modal is open");
}
3
Sudhir Bastakoti

si le modal est ouvert sous une forme chargée par ajax, vous pouvez utiliser 

$(document).on('hidden.bs.modal', '#photoModal', function () {
    cancel_camera();
    document.getElementById('PhotoPerson').innerHTML = '<img src="' +  photoPerson + '"/>';
});*
0
CelzioBR