javascript - 如何在ajax进程完成之前创建延迟？

Question

我有一个名为“插入评论”的按钮。当用户单击它时，将提交表单(使用ajax)并在数据库中插入新评论。现在我的问题是，当用户在此按钮上单击两次(快速)时，评论将被插入两次。

现在我想防止再次插入，我的意思是我想在ajax进程工作时禁用所有事件...可能吗？

这是我的代码:

 $("#bottunId").click(function(){
        $("#form-"+pure_id).submit(function(e){
           e.preventDefault(e);            
           comment(pure_id);
         });
});

function comment(pure_id){

    $("#textarea-"+pure_id).animate({opacity: 0.5}, 0);
    var frm = $('#form-'+pure_id);

    $.ajax({
        url :  frm.attr('action'),
        type : frm.attr('method'),
        data : frm.serialize(),
        dataType : 'JSON',
        success : function (commenting_system) {

        if(commenting_system.error_msg){
            $(".error_msg").html(commenting_system.error_msg); $(".error").fadeIn(200);
            close_error_msg = setTimeout(function(){ $(".error").fadeOut(100); }, 5000);
            $("#textarea-"+pure_id).animate({opacity: 1}, 0);
        }

        else{
                $("#table-"+pure_id).append('<tr><td>new row</td></tr>');
                $("#textarea-"+pure_id).animate({opacity: 1}, 0);
        }

        } // for success
    }); // for ajax
} // function comment

Answer 1

这应该适合你。它在表单中设置一个名为 subscribed 的标志，这将阻止表单在刷新页面之前再次提交。

$("#bottunId").click(function(){

    $("#form-"+pure_id).submit(function(e){

        if ($(this).data('submitted') !== true) {
            // Mark it so that the next submit can be ignored
            $(this).data('submitted', true);

            // submit form
            comment(pure_id);
        }
        e.preventDefault();
    });

});