确保ajax请求不会多次被触发

Question

我正在编写一个简单的表单页面,我想知道如果有人多次点击提交按钮会发生什么(因为当时我的共享主机似乎很慢).

此外,任何人都想看看我的代码

$.ajax({
    url: "submit.php",
    type: 'POST',
    data: form,
    success: function (msg) {
        $(".ressult").html("Thank You!");
    },
    error: function () {
        $(".result").html("Error");
    }
});

有没有办法在用户点击一次之后这样做,在第一次点击完成之前它不会再次运行？

谢谢

Answer 1

你可以使用jQuery的.one()函数:

(function handleSubmit() {
    $('#submitBtn').one('click', function() {
        var $result = $('.result');
        $.ajax({
            url: 'submit.php',
            type: 'POST',
            data: form,
            success: function (msg) {
                $result.html('Thank You!');
                handleSubmit(); // re-bind once.
            },
            error: function () {
                $result.html('Error');
            }
        }); // End ajax()
    }); // End one(click)
}()); // End self-invoked handleSubmit()

*编辑:*为多个提交添加了递归.