ajax绑定事件页面重复提交,ajax防止用户重复提交点击事件
生活随笔
收集整理的這篇文章主要介紹了
ajax绑定事件页面重复提交,ajax防止用户重复提交点击事件
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
防止ajax重復提交
提交
/**
* 模擬ajax提交
* @fn 回調函數
* */
function Ajax(fn){
setTimeout(function(){
var data= {result:true,msg:'提交成功！'};
fn(data);
},2000);
}
/**
* btn click 提交事件
*
* */
btn.οnclick=function(){
//檢查 按鈕是否被鎖住，鎖住直接rerun
if(btn.getAttribute('lock')){
return;
}
//上鎖
btn.setAttribute('lock',1);
//更改狀態
btn.innerText='提交中...';
//模擬ajax提交
Ajax(function(data){
//請求成功
if(data.result){
console.log('請求成功');
//請求成功解鎖
btn.setAttribute('lock',"");
//還原狀態
btn.innerText='提交';
}else{
console.log('請求失敗');
//請求失敗解鎖
btn.setAttribute('lock',"");
//還原狀態
btn.innerText='提交';
}
});
}
1.提交數據之前判斷當前提交按鈕是否存在lock鎖
2.在ajax提交之前給提交按鈕上鎖
3.ajax成功之后或者失敗之后解鎖
總結
以上是生活随笔為你收集整理的ajax绑定事件页面重复提交,ajax防止用户重复提交点击事件的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 王者荣耀实名认证怎么解除
- 下一篇： 如何把ajax改成同步请求,如何将Aja