Jquery Validation插件防止重复提交表单的解决方法


Posted in Javascript onMarch 05, 2010

由于在项目中应用了Jquery Validation表单验证插件,所以要实现在Validation验证完毕后,提交form,然后禁止按钮。
CodeProject上有一个DisableBtnPostBack项目,但不无法和Jquery Validation结合,代码先贴出来,给大家提示下,碰到这种情况不要使用该代码。代码如下:
js:
代码

function disableBtn(btnID, newText) { 
Page_IsValid = null; 
if (typeof (Page_ClientValidate) == 'function') { 
Page_ClientValidate(); 
} 
var btn = document.getElementById(btnID); 
var isValidationOk = Page_IsValid; 
if (isValidationOk !== null) { 
if (isValidationOk) { 
btn.disabled = true; 
btn.value = newText; 
btn.style.background = "url(12501270608.gif)"; 
} 
else { 
btn.disabled = false; 
} 
} 
else { 
setTimeout("setImage('"+btnID+"')", 10); 
btn.disabled = true; 
btn.value = newText; 
} 
} 
function setImage(btnID) { 
var btn = document.getElementById(btnID); 
btn.style.background = 'url(12501270608.gif)'; 
}

前端页面代码:
代码
<asp:button id="btnOne" tabIndex="0" Runat="server" Text="Submit" 
onclick="btnOne_Click" 
OnClientClick="disableBtn(this.id, 'Submitting...')" 
UseSubmitBehavior="false" />

好了,以下代码可以解决提交按钮完成Validation插件的Form验证后禁止按钮,提交Form:
js:
代码
$(document).ready(function() { 
$("#myForm").validate({ 
submitHandler: function(form) { 
$(form).find(":submit").attr("disabled", true).attr("value", 
"Submitting..."); 
form.submit(); 
} 
}) 
});
Javascript 相关文章推荐
解密效果
Jun 23 Javascript
Javascript 不能释放内存.
Sep 07 Javascript
基于jQuery的history历史记录插件
Dec 11 Javascript
Script标签与访问HTML页面详解
Jan 10 Javascript
Javascript仿PHP $_GET获取URL中的参数
May 12 Javascript
如何正确使用javascript 来进行我们的程序开发
Jun 23 Javascript
JavaScript中数组的合并以及排序实现示例
Oct 24 Javascript
AngularJS指令用法详解
Nov 02 Javascript
详解JavaScript RegExp对象
Feb 04 Javascript
JS表格组件神器bootstrap table使用指南详解
Apr 12 Javascript
基于Node.js搭建hexo博客过程详解
Jun 25 Javascript
关于React Native 无法链接模拟器的问题
Jun 21 Javascript
javascript下判断一个元素是否存在的代码
Mar 05 #Javascript
ExtJs扩展之GroupPropertyGrid代码
Mar 05 #Javascript
js 获取服务器控件值的代码
Mar 05 #Javascript
jquery checkbox全选、取消全选实现代码
Mar 05 #Javascript
javascript 隐藏/显示指定的区域附HTML元素【legend】用法
Mar 05 #Javascript
ExtJS 工具栏 分页事件参数
Mar 05 #Javascript
Microsoft Ajax Minifier 压缩javascript的方法
Mar 05 #Javascript
You might like
让你成为更出色的PHP开发者的10个技巧
2011/02/25 PHP
php产生随机数的两种方法实例代码 输出随机IP
2011/04/08 PHP
php学习笔记 面向对象中[接口]与[多态性]的应用
2011/06/16 PHP
PHP session会话的安全性分析
2011/09/08 PHP
php压缩HTML函数轻松实现压缩html/js/Css及注意事项
2013/01/27 PHP
PHP Class SoapClient not found解决方法
2018/01/20 PHP
PHP pthreads v3使用中的一些坑和注意点分析
2020/02/21 PHP
jQuery中用dom操作替代正则表达式
2014/12/29 Javascript
探讨:JavaScript ECAMScript5 新特性之get/set访问器
2016/05/05 Javascript
AngularJS包括详解及示例代码
2016/08/17 Javascript
js带闹铃功能的倒计时代码
2016/09/29 Javascript
官方推荐react-navigation的具体使用详解
2018/05/08 Javascript
Vue.js更改调试地址端口号的实例
2018/09/19 Javascript
JS左右无缝轮播功能完整实例
2019/05/16 Javascript
Js实现复选框的全选、全不选反选功能代码实例
2020/02/28 Javascript
[46:55]LGD vs Liquid 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/19 DOTA
[42:48]完美世界DOTA2联赛PWL S3 Magma vs INK ICE 第二场 12.11
2020/12/16 DOTA
使用Protocol Buffers的C语言拓展提速Python程序的示例
2015/04/16 Python
Python入门_条件控制(详解)
2017/05/16 Python
python实现简单http服务器功能
2018/09/17 Python
Python利用matplotlib做图中图及次坐标轴的实例
2019/07/08 Python
用Python获取摄像头并实时控制人脸的实现示例
2019/07/11 Python
用Pytorch训练CNN(数据集MNIST,使用GPU的方法)
2019/08/19 Python
python3.6连接mysql数据库及增删改查操作详解
2020/02/10 Python
Django实现内容缓存实例方法
2020/06/30 Python
Python自动登录QQ的实现示例
2020/08/28 Python
Python基于tkinter canvas实现图片裁剪功能
2020/11/05 Python
戴尔英国官网:Dell英国
2017/05/27 全球购物
Street One瑞士:德国现代时装公司
2019/10/09 全球购物
在网络中有两台主机A和B,并通过路由器和其他交换设备连接起来,已经确认物理连接正确无误,怎么来测试这两台机器是否连通?如果不通,怎么来判断故障点?怎么排
2014/01/13 面试题
入党积极分子思想汇报
2014/01/02 职场文书
英语专业职业生涯规划范文
2014/03/05 职场文书
协商一致解除劳动合同协议书
2014/09/14 职场文书
医院领导班子整改方案
2014/10/01 职场文书
城南旧事读书笔记
2015/06/29 职场文书
Anaconda安装pytorch及配置PyCharm 2021环境
2021/06/04 Python