Ajax在bootstrap模式上调用多次onclick事件 [英] Ajax call multiple time onclick event on bootstrap modal
问题描述
单击按钮它加载了一个bootstrap模式。在模态上有一个表单和单击保存按钮我试图通过ajax调用提交表单。第一次ajax调用触发一次,但第二次ajax url触发两次。我在firebug控制台部分看到post url被多次调用。
By clicking a button Its loaded a bootstrap modal. On the modal there have a form and on click save button I am trying to submit form by ajax call. At first time the ajax call trigger one time, but 2nd time the ajax url trigger two times. I see on firebug console section the post url is called multiple times.
这是我的jquery代码。
Here Is my jquery code.
$(".show-modal").click(function() {
$('.upload-modal').modal();
$(".save-logo").click(function(e) {
e.preventDefault();
$.ajax({
type : "POST",
data : data,
contentType: false,
cache : false,
processData: false,
url : "../../io/upload/"
}).done(function(rawData) {
$('.modal-header .close').click();
})
});
})
问题是你在.show-modal点击处理程序中有.save-logo点击处理程序。因此,每次显示模态时,都会将另一个单击处理程序附加到.save-logo元素。下面的代码应解决这个问题:
The problem is that you have your .save-logo click handler inside the .show-modal click handler. So every time the modal is shown, you attach another click handler to the .save-logo element. The code below should fix that problem:
$(".show-modal").click(function () {
$('.upload-modal').modal();
});
$(".save-logo").click(function (e) {
e.preventDefault();
$.ajax({
type: "POST",
data: data,
contentType: false,
cache: false,
processData: false,
url: "../../io/upload/"
}).done(function (rawData) {
$('.modal-header .close').click();
})
});
这篇关于Ajax在bootstrap模式上调用多次onclick事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!