У меня есть элемент "a", который серверы как кнопка. У него нет атрибута href.
Я использую jQuery для очень простой вещи: при нажатии запускает запрос ajax и предотвращает дальнейшие щелчки. После завершения работы ajax включите щелчок. Я не использую форму или кнопку ввода.
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();
});
}
);
Это работает нормально, за исключением того, что я могу нажимать «Отправить» столько раз, сколько хочу, и каждый щелчок будет генерировать новый запрос ajax. Как предотвратить клики по элементу «a» во время выполнения запроса ajax?

Используйте один из этих методов, возвращая ссылку, когда возвращается вызов 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, это заморозит страницу до завершения запроса.
Обычно это плохо воспринимается пользователем, особенно если запрос занимает некоторое время.