当你关闭并重新打开模态时,shown.bs.modal会多次触发

Question

我已经做了一个小提琴,说明了我目前面临的问题.所以每次我关闭并打开一个模态,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();
});

Answer 1

或者你可以尝试这个:

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

Answer 2

@ 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/

.one()方法与.on()相同,只是处理程序在第一次调用后未绑定

Answer 3

您需要从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();
});

Answer 4

下面的函数用于我的应用程序中的所有对话框.

每次都会调用它来执行不同的回调.对我来说最简单的解决方案就是在添加新事件之前删除事件处理程序.

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