我有一个模态表单 - bootstrap css - 每次点击按钮都会提交额外的时间,例如
- 第一次点击,1次提交
- 第二次点击,2 次提交
- 第三次点击,3 次提交
- 等等,等等
下面是我使用的 jQuery。模态是从另一个模态(动态创建的)调用的,因此我需要使用 $(document) 调用方法。我试过 $(document).on( 'submit', '#pos_form', function(e) { ... }); e.preventDefault() 也是如此,但这没有任何区别,'$('#posModal').remove('#pos_form');'也没有。
/* Calling page */
$(document).ready(function() {
$('.posbutton').on('click', function(e) {
var id = '#'+this.id;
openSpinner();
$.ajax({
url: 'ajax_pos_form.php',
type: 'post',
dataType: 'html',
data: { GRIDCO: $(id).data('gridco'), project $(id).data('project'), gridconame: $(id).data('name') }
})
.done(function( response ) {
if ( response) {
$('#posModal').html('');
$('#posModal').append(response);
$('#posModal').modal('show');
}
closeSpinner();
});
});
});
/* page with modal form */
$(document).ready(function() {
$(document).on( 'click', '#submit', function(e){
$.ajax({
url: 'ajax_pos_form.php'
, type: 'post'
, dataType: 'json'
, data: $('#pos_form').serialize()
, success: function(response) {
if ( response.success ) {
$('#posModal').modal('hide');
return false;
}
else {
alert ( response.msg );
return false;
}
$('#posModal').remove('#pos_form');
$('#posModal').modal('hide');
return false;
}
});
return false;
});
});
在我的测试页中,不是从模态调用的,它也不起作用。任何帮助将不胜感激
最佳答案
我在类似的模态操作中遇到了同样的问题并使用了:
("#modal_submit_button").unbind('点击');
此事件附加到打开模式的函数。
这样,每次打开模式时,都会重置事件监听器。
("#open_modal_button").click(function(){
("#modal_submit_button").unbind('click');
("#modal").modal('toggle');
//OTHER CODE
}
关于javascript - Bootstrap 模态表单在首次提交后多次提交,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37698593/