如何使用jQuery防止双重提交（$。post） [英] How can I prevent a double submit($.post) with jQuery

问题描述

（$（$）$（$）$（$）$（$）$（$）$（$）$
e.preventDefault（）;

//如果用户多次点击按钮发送

$ .post（url， {data：data1，data2：data2}，function（rp）{

}）;

}）;

}）;

因为如果用户反复点击按钮发送2次post，而不禁止提交按钮

解决方案

使用特殊类（例如：提交）作为标记表示请求正在进行：

  $（＃enviar）。click（function（e）{
 e.preventDefault（）; 
 
 var btn = this; 
 //检查是否已经存在：
 if（$（btn）.is（'。submitting' ）{
 return; 
} 
 //在请求之前添加：
 $（btn）.addClass（'submitting'）; 
 
 $。 post（url，{data：data1，data2：data2}，function（rp）{
 
}）always（function（）{
 //完成或失败后删除：
 $（btn）.removeClass（'submitting'）; 
}）; 
}）; 
  

$(document).ready(function(){

    $("#enviar").click(function(e){

        e.preventDefault();

        //prevent run 2 or more times if the user clicks the button multiple times to send

        $.post(url,{data:data1,data2:data2},function(rp){

        });

    });

});

as prevent send 2 times the "post" if the user repeatedly click the button, without disabling the submit button

解决方案

Use a special class (e.g : submitting) as a marker to indicate the request is in progress :

$("#enviar").click(function(e){
    e.preventDefault();

    var btn = this;
    // check if already present :   
    if ( $(btn).is('.submitting') ){
        return;
    }
    // add it before request :
    $(btn).addClass('submitting');

    $.post(url,{data:data1,data2:data2},function(rp){

    }).always(function(){
        // remove it after completion or failure :
        $(btn).removeClass('submitting');
    });
});

这篇关于如何使用jQuery防止双重提交（$。post）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！