php+ajax远程加载避免重复提交
近日在练习签到送积分功能时,发现可以在一瞬间的时候提交好多次 导致可以重复领取多次积分 除了增加请求限制之外 发现ajax提交没有限制重复提交 遂立此贴为警示
首先上表单代码
<form onsubmit="return check_login()" style="text-align: center;margin-top:50px"> <input value="登 录" class="btn_submit" id="btn_submit" type="submit"> </form>
表单样式代码
.btn_submit { background-color: #e31436; color: #fff; cursor: pointer; display: inline-block; font-size: 18px; height: 44px; line-height: 44px; text-align: center; width: 200px; border-radius: 2px; border:none } .disabled{opacity: 0.5;cursor:default}
AJAX防重复提交代码
function check_login() { if ($("#btn_submit").hasClass("disabled"));//避免重复提交 判断是否为disabled return false; //是 返回false $("#btn_submit").addClass("disabled").val("正在提交"); //提交第一时间给class加上disabled $.post("login.php", {id: 1}, function(data) { $("#btn_submit").removeClass("disabled").val("登 录"); //成功返回后 取消disabled location.href = "http://www.sucaihuo.com/php/2747.html"; }, "json"); return false; }