shown.bs.modal se déclenche plusieurs fois lorsque vous fermez et rouvrez modal

J'ai fait du violon illustrant la question, je suis confronté en ce moment. Donc, à chaque fois que je ferme et ouvrir un modal, shown.bs.modal déclenche également à de multiples reprises. Dans ce violon, à chaque fois que vous fermez et ouvrez un modal, le nombre d'alertes augmente aussi (quand il est censé déclencher qu'une seule fois). http://jsfiddle.net/j36h2/1/

function openTestModal(){
    $('#testModal').modal({
        keyboard: false,
        backdrop: 'static'
    });

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

$('.testButton').click(function(){
    openTestModal();
});

source d'informationauteur pewpewlasers

  1. 13

    Vous avez besoin d'extraire votre fonction d'alerte de votre événement click :

    http://jsfiddle.net/SyCNj/2/

    extrait :

    function openTestModal(){
    $('#testModal').modal({
        keyboard: false,
        backdrop: 'static'
    });
}

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

$('.testButton').click(function(){
    openTestModal();
});
  2. 12

    ou vous pouvez essayer ceci :

    $('#testModal').on('shown.bs.modal', function (e) {
 alert('');
 $(this).off('shown.bs.modal');
});
  3. 11

    Accepté la réponse de @Put12co22mer2 est correct. Cependant, il ya des moments où vous souhaitez relier l'événement lors de l'ouverture du modal. Disons que vous avez quelques options qui devraient être utilisés.

    function openTestModal(options){
    $('#testModal').modal({
        keyboard: false,
        backdrop: 'static'
    });

    $('#testModal').one('shown.bs.modal', function (e) {
        //do something with options
        alert(options.foo);
    });
}

$('.testButton').click(function(){
    openTestModal({ foo: bar});
});

    Ensuite, vous pouvez utiliser one au lieu de on. Le résultat sera le même que la déliaison, mais un peu plus propre à mon avis.

    http://api.jquery.com/one/

    L' .un() la méthode est identique .sur(), sauf que le gestionnaire est
    indépendant après sa première invocation

  4. 4

    C'est parce que vous êtes fixation de plusieurs gestionnaires d'événements pour l'événement, cliquez d'abord sur l'écoute une fois, sur le deuxième clic deux fois et ainsi de suite, écouter l'événement en dehors du contexte de openTestModal fonction.

  5. 4

    La fonction ci-dessous est utilisé pour toutes les boîtes de dialogue dans mon application.

    Elle est appelée à chaque fois avec un autre rappel pour s'exécuter. La solution la plus simple pour moi est tout simplement de supprimer le gestionnaire d'événements avant d'en ajouter un nouveau.

    function messageBox(action,...) {               
    $("#modal-btn-ok").off("click");
    $("#modal-btn-ok").on("click", function(e) {
        action(e);
    });
  6. 0

    Définir variable et définissez sa valeur à 1; genre: 

    function openTestModal(){
                $('#testModal').modal({
                    keyboard: false,
                    backdrop: 'static'
                });
               var e=1;
                $('#testModal').on('shown.bs.modal', function (e) {
                    alert('');
                    e=0;
                });
            }
  7. 0

    Vous pouvez essayer comme suit: (Bootstrap v3.3.6)

    $('#dialog')
.modal({show: false})
.on('hide.bs.modal', function () {
    //..................
}).on('shown.bs.modal', function (event) {
    //..................                  
}).on('hidden.bs.modal', function () {
    $("#dialog").off();
});
$('#dialog').modal('show');