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 相关文章推荐
让ie6也支持websocket采用flash封装实现
Feb 18 Javascript
Jquery 在页面加载后执行的几种方式
Mar 14 Javascript
jQuery中eq()方法用法实例
Jan 05 Javascript
封装好的一个万能检测表单的方法
Jan 21 Javascript
JQuery中解决重复动画的方法
Oct 17 Javascript
socket.io学习教程之深入学习篇(三)
Apr 29 Javascript
vue.js中v-on:textInput无法执行事件问题的解决过程
Jul 12 Javascript
vue.js移动端app之上拉加载以及下拉刷新实战
Sep 11 Javascript
微信小程序实现给嵌套template模板传递数据的方式总结
Dec 18 Javascript
vue定义全局变量和全局方法的方法示例
Aug 01 Javascript
快速解决layui弹窗按enter键不停弹窗的问题
Sep 18 Javascript
js实现登录时记住密码的方法分析
Apr 05 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的加密方式及原理
2012/06/14 PHP
php验证是否是md5编码的简单代码
2014/04/01 PHP
yii2.0实现验证用户名与邮箱功能
2015/12/22 PHP
Yii全局函数用法示例
2017/01/22 PHP
php常用的工具开发整理
2019/09/26 PHP
IE8 中使用加速器(Activities)
2010/05/14 Javascript
发布一个基于javascript的动画类 Fx.js
2010/11/05 Javascript
Javascript中的for in循环和hasOwnProperty结合使用
2013/06/05 Javascript
JavaScript原型链示例分享
2014/01/26 Javascript
jQuery 隐藏和显示 input 默认值示例
2014/06/03 Javascript
使用node.js 制作网站前台后台
2014/11/13 Javascript
浅谈轻量级js模板引擎simplite
2015/02/13 Javascript
jQuery Easyui使用(一)之可折叠面板的布局手风琴菜单
2016/08/17 Javascript
NodeJS创建最简单的HTTP服务器
2017/05/15 NodeJs
jQuery实现的回车触发按钮事件功能示例
2018/03/25 jQuery
Vue 应用中结合vux使用微信 jssdk的方法
2018/08/28 Javascript
[01:56]2014DOTA2西雅图邀请赛 MVP外卡赛老队长精辟点评
2014/07/09 DOTA
python批量替换多文件字符串问题详解
2018/04/22 Python
python实现对任意大小图片均匀切割的示例
2018/12/05 Python
Python3简单爬虫抓取网页图片代码实例
2019/08/26 Python
分享8点超级有用的Python编程建议(推荐)
2019/10/13 Python
python各层级目录下import方法代码实例
2020/01/20 Python
Java byte数组操纵方式代码实例解析
2020/07/22 Python
python输入中文的实例方法
2020/09/14 Python
python 多线程中join()的作用
2020/10/29 Python
python快速安装OpenCV的步骤记录
2021/02/22 Python
通过css3的filter滤镜改变png图片的颜色的示例代码
2020/05/06 HTML / CSS
复古服装:RetroStage
2019/05/10 全球购物
医学专业毕业生个人求职信
2013/12/25 职场文书
人事部经理岗位职责
2014/03/07 职场文书
安全责任书范文
2014/08/25 职场文书
学习十八届四中全会依法治国心得体会
2014/11/03 职场文书
党的群众路线教育实践活动个人对照检查材料(企业)
2014/11/05 职场文书
2014群众路线学习笔记
2014/11/06 职场文书
2014年小学体育工作总结
2014/12/11 职场文书
2015年电厂工作总结范文
2015/05/13 职场文书