Bootstrap jquery événement show.bs.modal ne se déclenchera pas

Question

Je suis en train d'utiliser l'exemple de modal des documents bootstrap 3. Le modal fonctionne. Cependant j'ai besoin d'accéder à l'événement show.bs.modal quand il se déclenche. Pour l'instant j'essaie simplement :

$('#myModal').on('show.bs.modal', function () {
alert('hi')
})

Rien ne se passe, l'événement ne se déclenche pas. Qu'est-ce que je fais mal ??? Cela n'a pas de sens pour moi.

Answer 1

Utilisez ceci :

$(document).on('show.bs.modal','#myModal', function () {
  alert('hi');
})

Answer 2

Assurez-vous de mettre votre on('shown.bs.modal') avant d'instancier le modal pour le faire apparaître

$("#myModal").on("shown.bs.modal", function () { 
    alert('Salut');
});
$("#myModal").modal('show'); //Cela peut également être $("#myModal").modal({ show: true });

ou

$("#myModal").on("shown.bs.modal", function () { 
    alert('Salut');
}).modal('show');

Pour se concentrer sur un champ, il est préférable d'utiliser le shown.bs.modal au lieu de show.bs.modal mais peut-être pour d'autres raisons vous voulez masquer quelque chose en arrière-plan ou régler quelque chose juste avant que le modal commence à s'afficher, utilisez la fonction show.bs.modal.

Answer 3

Enveloppez votre fonction dans $(document).ready(function() { }), ou plus simplement, $(function() {. En CoffeeScript, cela ressemblerait à

$ ->
  $('#myModal').on 'show.bs.modal', (event)->

Sans cela, le JavaScript s'exécute avant le chargement du document, et #myModal ne fait pas encore partie du DOM. Voici la référence Bootstrap.

Answer 4

$(document).on('shown.bs.modal','.modal', function () {

/// ÉVÉNEMENTS À FAIRE

});

Answer 5

Essayez ceci

$('#myModal').on('shown.bs.modal', function () {
   alert('salut');
});

Utiliser shown au lieu de show, assurez-vous également d'avoir vos points-virgules à la fin de votre fonction et de l'alerte.