我给出了一个模型以供确认:
<div class="modal" tabindex="-1" role="dialog" id="modal">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
... Body ...
<div class="modal-footer">
<button type="button" id="btnCancel" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="button" id="btnOk" class="btn btn-primary" data-dismiss="modal">Ok</button>
</div>
</div>
</div>
</div>
下面是显示上述模式的代码。
var M = {
confirm: function(body, yes, no) {
$('#btnCancel').on('click', function() {
$('#btnCancel').off();
$('#confirm-modal').modal('hide');
if (no) {
return no();
}
});
$('#btnOk').on('click', function() {
$('#btnOk').off();
$('#modal').modal('hide');
if (yes) {
return yes();
}
});
}
}
下面是我如何使用它...(例如在任何视图中)
M.confirm("Body", function(){
// Function Body
})
现在,问题是:如果我调用confirm,它显示模态。但是如果我单击Cancel,然后再次调用confirm(确认),这一次,我点击OK:函数(上面代码段中的第二个参数)被调用两次。如果我点击取消10次,上面的函数调用10次。
知道为什么会这样吗?
谢谢.
每次调用confirm
时,都将一个事件处理程序添加到btncancel
和btnok
中。
但是,您只在单击其中一个按钮时删除该按钮上的效果处理程序。
因此,如果调用confirm
,然后单击btncancel
,然后调用confirm
您将在btnok
上有两个事件处理程序:一个来自对confirm
的第一次调用,一个来自第二次调用。
单击任何一个按钮时,都需要删除这两个事件处理程序。
…或者只在加载文档时添加事件处理程序,之后不要再碰它们。