Web应用中使用javascript阻止某个提交按钮被重复点击
来源:互联网 发布:电子管设计软件 编辑:程序博客网 时间:2024/06/04 16:16
本来应用在服务器端有校验,对“连续猛击”导致的重复提交也就没太在意。
结果最近有几个页面因为机制原因,在服务器端没有及时加上重复提交校验,出了bug
于是拿起javascript来搞
想的是很简单,只要找到submit,onclick加个事件把自己disable1秒就可以了。
结果悲剧的发现在IE中,如果submit按钮被disable,就不会触发form的提交.
于是绕大圈去找不用disable能禁用一个按钮的方法。无果。
最后意外的发现,原先认为"如果submit按钮被disable,就不会触发form的提交."并不准确,
准确的说submit是在在onclick事件之后触发的。
在submit前的onclick事件中如果button被diable,估计submit时有检查submit按钮状态,若disabled则form不提交。
那么只要是在submit触发后再disabledsubmit按钮。就不影响提交。
于是乎,加了个settimeout。成功。
最终方法如下
function locksubmitbutton(){
var callbackfunction=function(){
var theEvent = window.event || arguments[0];
var itemx= theEvent.srcElement||theEvent.target;
setTimeout(function(){itemx.disabled=true;},0);
setTimeout(function(){itemx.disabled=false;},1000);
};
var vTag = document.getElementsByTagName("INPUT");
for(var i=0;i<vTag.length;i++){
if(vTag[i].type=="submit"){
vTag[i].attachEvent?vTag[i].attachEvent("onclick",callbackfunction):vTag[i].addEventListener("click",callbackfunction,false);
}
}
}
var callbackfunction=function(){
var theEvent = window.event || arguments[0];
var itemx= theEvent.srcElement||theEvent.target;
setTimeout(function(){itemx.disabled=true;},0);
setTimeout(function(){itemx.disabled=false;},1000);
};
var vTag = document.getElementsByTagName("INPUT");
for(var i=0;i<vTag.length;i++){
if(vTag[i].type=="submit"){
vTag[i].attachEvent?vTag[i].attachEvent("onclick",callbackfunction):vTag[i].addEventListener("click",callbackfunction,false);
}
}
}
- Web应用中使用javascript阻止某个提交按钮被重复点击
- asp.net中如何防止用户重复点击提交按钮
- 【asp.net中如何防止用户重复点击提交按钮】
- 使用Jquery blockUI插件实现在点击按钮提交后阻止再次点击,当处理完后解除阻止
- JavaScript 不重复提交(当用户连续点击提交按钮 情景)
- grails中阻止页面表单重复提交
- ASP.NET防止重复点击提交按钮
- 解决:防止页面按钮被重复点击,导致页面重复提交的问题
- Code9 点击按钮使用JavaScript清除Web控件的值
- 集群 分布式WEB开发如何阻止重复提交
- javascript下阻止表单重复提交、防刷新、防后退
- 关于Asp.Net中避免用户连续多次点击按钮,重复提交表单的处理
- js中防止连续点击按钮导致多次重复提交数据的方法
- 提交按钮重复提交
- 使用JavaScript控制重复提交
- button按钮防重复提交(点击提交之后提交按钮变灰)
- javascript阻止表单提交
- javascript 阻止提交不成功
- Erlang 中lists的用法详解和例子说明,详细 全
- 常用工具总结
- spring中配置hibernate二级缓存
- linux下write操作原理、错误原因及处理方法
- asp.net实现视频在线播放
- Web应用中使用javascript阻止某个提交按钮被重复点击
- mysql中的unsigned
- android listview 高级使用
- 为什么使用 Redis及其产品定位
- tar命令示例及详解
- python写excel
- xcode4 自定义静态库的编译和使用
- Redis复制与可扩展集群搭建
- Android ApiDemo学习(四)Views——3 Buttons、Chronometer、Controls、Custom、DateWidget