показано.bs.modal срабатывает несколько раз при закрытии и повторном открытии modal

Я сделал скрипку, иллюстрирующую проблему, с которой я сталкиваюсь в данный момент. Поэтому каждый раз, когда я закрываю и открываю модальное, shown.bs.modal также срабатывает несколько раз. В этой скрипке каждый раз, когда вы закрываете и открываете модальный, количество предупреждений также увеличивается (когда он должен срабатывать только один раз). 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();
});
13
javascript jquery twitter-bootstrap twitter-bootstrap-3

7 ответов

вам нужно извлечь функцию оповещения из события click:

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

выдержка :

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

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

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

или вы можете попробовать это :

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

принятый ответ от @Put12co22mer2 является правильным. Тем не менее, бывают случаи, когда вы хотите перезапустить событие при открытии модального. Допустим, у вас есть несколько вариантов, которые следует использовать.

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});
});

затем вы можете использовать one вместо on. Результат будет таким же, как и расплетение, но немного чище, на мой взгляд.

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

The .один() метод идентичен .на(), за исключением того, что обработчик unbound после первого вызова

11

это потому, что вы прикрепляете несколько обработчиков событий для события, при первом щелчке вы слушаете один раз, при втором щелчке дважды и так далее, слушайте событие вне контекста .

4

функция, приведенная ниже, используется для всех окон в моем приложении.

он вызывается каждый раз с другим обратным вызовом для выполнения. Самое простое решение для меня - просто удалить обработчик событий перед добавлением нового.

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

определите переменную и установите ее значение в 1; например:

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

вы можете попробовать следующее: (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');
0