//对话框
//生成对话框
function createDialog(){
if ($("#dialog").length == 0){
var str = '';
str += '
';
str += '
';
str += '';
str += '
对话框
';
str += '';
str += '
';
str += ''
str += ''
str += ''
str += ''
$(str).appendTo('body');
}
}
$('*[data-target="#dialog"]').click(function(){
createDialog();
$('#dialog').on('show.bs.modal', function (event) {
var button = $(event.relatedTarget);
var action = button.data('action');
var modal = $(this);
switch(action)
{
case 'add':
modal.find('.modal-dialog').addClass('modal-lg');
modal.find('.modal-title').text('添加用户');
modal.find('.modal-body').html('这里是表单');
modal.find('.modal-footer button[type="submit"]').removeClass('btn-danger').addClass('btn-primary').text ('添加');
alert('1'); //测试
break;
}
});
//关闭对话框后清除modal中数据
$("#dialog").on("hidden.bs.modal", function() {
$(this).removeData("bs.modal");
});
})
html代码
当点击添加按钮后,会先执行alert('1'),然后弹出对话框,我关闭对话框之后,再点击添加,那么这次的alert('1')会被执行两次,也就是说我会收到2次警告框,但是modal对话框会等alert('1')执行完毕了弹出。如果再关掉Modal对话框,再点击按钮,会执行3次alert('1'),以此类推。
那我是不是可以理解为,以下代码会因为点击按钮的次数而被执行多次。
case 'add':
modal.find('.modal-dialog').addClass('modal-lg');
modal.find('.modal-title').text('添加用户');
modal.find('.modal-body').html('这里是表单');
modal.find('.modal-footer button[type="submit"]').removeClass('btn-danger').addClass('btn-primary').text ('添加');
alert('1'); //测试
break;
那么,我应该如何解决这个问题?
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
其实还可以这么解决,,我不是搞前端的,但是这种问题遇见过
第一种:把事件放到click事件外去定义
第二种: 先移除事件再绑定事件
一直搞不明白这个问题出现的原因,现在我的暴力解决办法是当关闭了对话框后remove()掉这个对话框,问题解决。
JS代码