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 相关文章推荐
跟着Jquery API学Jquery之一 选择器
Apr 07 Javascript
让你的博客飘雪花超出屏幕依然看得见
Jan 04 Javascript
jquery动态加载js三种方法实例
Aug 03 Javascript
原生js实现复制对象、扩展对象 类似jquery中的extend()方法
Aug 30 Javascript
jQuery旋转木马式幻灯片轮播特效
Dec 04 Javascript
Bootstrap菜单按钮及导航实例解析
Sep 09 Javascript
BootStrap 弹出层代码
Feb 09 Javascript
JavaScript使用FileReader实现图片上传预览效果
Mar 27 Javascript
详解利用Angular实现多团队模块化SPA开发框架
Nov 27 Javascript
详解redux异步操作实践
Aug 15 Javascript
更优雅的微信小程序骨架屏实现详解
Aug 07 Javascript
深入理解 ES6中的 Reflect用法
Jul 18 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
Zend Framework教程之Zend_Form组件实现表单提交并显示错误提示的方法
2016/03/21 PHP
PHP pthreads v3下worker和pool的使用方法示例
2020/02/21 PHP
使用Javascript和DOM Interfaces来处理HTML
2006/10/09 Javascript
在一个js文件里远程调用jquery.js会在ie8下的一个奇怪问题
2010/11/28 Javascript
Javascript延迟执行实现方法(setTimeout)
2010/12/30 Javascript
jquery中event对象属性与方法小结
2013/12/18 Javascript
jQuery中的val()示例应用
2014/02/26 Javascript
JS往数组中添加项性能分析
2015/02/25 Javascript
Bootstrap入门书籍之(一)排版
2016/02/17 Javascript
总结十个Angular.js由浅入深的面试问题
2016/08/26 Javascript
jquery对Json的各种遍历方法总结(必看篇)
2016/09/29 Javascript
手把手教你把nodejs部署到linux上跑出hello world
2017/06/19 NodeJs
微信小程序列表渲染功能之列表下拉刷新及上拉加载的实现方法分析
2017/11/27 Javascript
JavaScript数据结构与算法之基本排序算法定义与效率比较【冒泡、选择、插入排序】
2019/02/21 Javascript
vue自定义指令用法经典实例小结
2019/03/16 Javascript
JS一次前端面试经历记录
2020/03/19 Javascript
[49:05]OG vs Newbee 2019DOTA2国际邀请赛淘汰赛 胜者组 BO3 第二场 8.21.mp4
2020/07/19 DOTA
Python利用多进程将大量数据放入有限内存的教程
2015/04/01 Python
使用Python实现毫秒级抢单功能
2019/06/06 Python
python 猴子补丁(monkey patch)
2019/06/26 Python
python文件选择对话框的操作方法
2019/06/27 Python
Python3.7 基于 pycryptodome 的AES加密解密、RSA加密解密、加签验签
2019/12/04 Python
在tensorflow实现直接读取网络的参数(weight and bias)的值
2020/06/24 Python
CheapTickets泰国:廉价航班,查看促销价格并预订机票
2019/12/28 全球购物
Strathberry苏贝瑞中国官网:西班牙高级工匠手工打造
2020/10/19 全球购物
销售行政专员职责
2014/01/03 职场文书
创业者迈进成功第一步:如何写创业计划书?
2014/03/22 职场文书
艺术节主持词
2014/04/02 职场文书
安全标语口号
2014/06/09 职场文书
美术学专业求职信
2014/07/23 职场文书
踏青活动策划方案
2014/08/19 职场文书
民族学专业大学生职业规划范文:清晰未来的构想
2014/09/20 职场文书
责任书格式
2015/01/29 职场文书
教师廉洁自律个人总结
2015/02/10 职场文书
学校教学管理制度
2015/08/06 职场文书
win10蓝屏0xc0000001安全模式进不了怎么办?win10出现0xc0000001的解决方法
2022/08/05 数码科技