javascript - 单击输入时使用jQuery忽略表单提交

Question

我有一个带有提交输入的表单，我需要在单击按钮时，我的脚本执行一些 Ajax 操作。我还需要在 Ajax 请求期间禁用该按钮。所以我需要一个 jQuery 命令来避免在单击输入时提交真正的表单。我试着用这个：

$('input.searchplease').click(function () {
    $(this).attr('disabled', 'disabled');

    alert('Yep');
    //Do Ajax
});

这没有奏效。我的意思是，警报显示正确，但表单已提交。那么你的建议是什么？

Answer 1

试试这个：

$('input.searchplease').click(function (e) {
   $(this).attr('disabled', 'disabled');

   alert('Yep');
   //Do Ajax

   e.preventDefault();
});

Answer 2

$('input.searchplease').click(function () {
    alert('yep');
    return false;
});

这应该工作

Answer 3

你可以这样做：

$('form').submit(function(){
    ... ajax things

    return false;
});

我宁愿不禁用按钮（然后启用它），除非我必须这样做。

Answer 4

试试这种方式：

$("#id-of-your-form").submit(function() {

    $("#id-of-your-submit-input").attr("disabled", true);

    // do-ajax
    // you can use jquery's ajax complete handler to enable the submit button again

    return false;
});

Answer 5

我认为这可以解决问题：

$('form').submit(function(event) {
    event.preventDefault();
    $('#submit-button-ID').attr('disabled', 'disabled');
    $.ajax({
        ...,
        success: function() {
                $('#submit-button-ID').removeAttr('disabled');
              }
    });
});