Jquery 如何禁止在ajax请求进行中单击链接?
我有一个“a”元素,它将服务器作为按钮。它没有href属性 我使用jQuery实现了一件非常简单的事情:单击启动ajax请求并阻止进一步的单击。ajax完成后,启用单击。我不使用表单或输入按钮Jquery 如何禁止在ajax请求进行中单击链接?,jquery,ajax,Jquery,Ajax,我有一个“a”元素,它将服务器作为按钮。它没有href属性 我使用jQuery实现了一件非常简单的事情:单击启动ajax请求并阻止进一步的单击。ajax完成后,启用单击。我不使用表单或输入按钮 var contact= { send: function() { $.ajax({ type: "POST", url: "ws/ContactService.asmx/SendEmail", data: '
var contact= {
send: function() {
$.ajax({
type: "POST",
url: "ws/ContactService.asmx/SendEmail",
data: '{"fromEmail":"' + $("#email").val() + '", "fromName":"' + $('#name').val() + '", "subject":"' + $('#subject').val() + '", "message":"' + $('#message').val() + '"}',
contentType: "application/json; charset=utf-8",
dataType: "json",
error: function() {
alert("Error");
},
success: function(msg) {
alert(msg.d);
},
complete: function() {
$("#send").text("Send");
}
});
}
};
$(document).ready(function() {
$("#send").("click", function() {
$("#send").text("Sending...");
contact.send();
});
}
);
这很好,除了我可以点击send任意多次,每次点击都会产生新的ajax请求。如何防止在进行ajax请求时单击“a”元素?使用,在ajax调用返回时设置回链接。您可以使用以下方法:
var contact = {
inprogress: false,
send: function() {
if (contact.inprogress)
return;
contact.inprogress = true;
$.ajax({
...
complete: function() {
$("#send").text("Send");
contact.inprogress = false;
}
});
}
};
或者将async设置为false,这将冻结页面直到请求完成,这通常会造成非常糟糕的用户体验,尤其是在请求需要一段时间的情况下。