修改jQuery Validation里默认的验证方法


Posted in Javascript onFebruary 14, 2012

在最近做的一个项目中,使用jQuery Validation验证日期,遇到的问题和一个没有预料到的情况是,在ASP.NET MVC 3的项目中,对于 <input type="date" data-val="true" />的元素,如果调用form的valid方法验证form,虽然我没有添加日期验证的设置,仅仅type="date",但其依然调用了日期验证逻辑来验证日期格式是否正确。这本来是个不错的行为,但问题在于,其支持的日期格式有限,阅读jQuery Validation的代码会知道(当然,文档中也有说明),对于“date”,日期验证只是利用Javascript内置的处理来验证,反映到代码里,就是看new Date(日期字符串)能否成功。在我的电脑中,输入日期"9/5/2012"可以验证通过,但“2012-9-5”验证失败,后者显然也是一种正确的格式。我需要改变或者改善这种行为。如何做?

当然,我们可以修改jQuery Validation的源代码,但是首先,我引用的是CDN上的代码,其次,作为一个public的库,我想还是尽量不要自己去改动,日久天长,可能我们已经忘记了对它的修改,而官方更新新版本时,我们弄下来更新,结果就把我们自己的修改给覆盖了。更好的办法,是打补丁,从外部把date的验证函数替换成我们自己的。这里或许要感谢Javascript的OO还不是那么彻底,并没有把那些内置验证方法整成protected/private,看了源代码之后,替换的方法很简单,在引用jQuery Validation的源码之后,再这样替换:

$.validator.methods.date = function (value, element) 
{ 
// Date.parse函数源自另外一个处理日期的库 
return this.optional(element) || Date.parse(value) != null; 
};

此外替换默认的message,也可以用同样的办法,比如:
$.validator.messages.date = "hey, you entered an invalid date"

当然,处理messages有其他支持的更好的办法,这在jQuery Validation的全球化和本地化的说明中有提及。
Javascript 相关文章推荐
xml 与javascript结合的问题解决方法
Mar 24 Javascript
jQuery 性能优化指南(2)
May 21 Javascript
jquery 子窗口操作父窗口的代码
Sep 21 Javascript
JS 打印界面的CSS居中代码适用所有浏览器
Mar 19 Javascript
浅谈jQuery中hide和fadeOut的区别 show和fadeIn的区别
Aug 18 Javascript
form表单数据封装成json格式并提交给服务器的实现方法
Dec 14 Javascript
bootstrap中日历范围选择插件daterangepicker的使用详解
Apr 17 Javascript
JS 音频可视化插件Wavesurfer.js的使用教程
Oct 31 Javascript
JavaScript实现星级评价效果
May 17 Javascript
JS数组降维的实现Array.prototype.concat.apply([], arr)
Apr 28 Javascript
简单了解JavaScript作用域
Jul 31 Javascript
es5 类与es6中class的区别小结
Nov 09 Javascript
利用jquery的获取JS文件中的字符串内容
Feb 14 #Javascript
js 金额文本框实现代码
Feb 14 #Javascript
jQuery UI Autocomplete 体验分享
Feb 14 #Javascript
JavaScript/jQuery 表单美化插件小结
Feb 14 #Javascript
Firefox/Chrome/Safari的中可直接使用$/$$函数进行调试
Feb 13 #Javascript
情人节之礼 js项链效果
Feb 13 #Javascript
jQuery.getScript加载同域JS的代码
Feb 13 #Javascript
You might like
PHP 日志缩略名的创建函数代码
2010/05/26 PHP
php中设置index.php文件为只读的方法
2013/02/06 PHP
php调用nginx的mod_zip模块打包ZIP文件
2014/06/11 PHP
ThinkPHP无限级分类原理实现留言与回复功能实例
2014/10/31 PHP
浅析php设计模式之数据对象映射模式
2016/03/03 PHP
详解PHP使用Redis存储session时的一个Warning定位
2017/07/05 PHP
jQuery:节点(插入,复制,替换,删除)操作
2013/03/04 Javascript
跟我学Nodejs(二)--- Node.js事件模块
2014/05/21 NodeJs
深入理解JavaScript系列(18):面向对象编程之ECMAScript实现
2015/03/05 Javascript
深入浅析JavaScript的API设计原则
2016/06/14 Javascript
漫谈JS引擎的运行机制 你应该知道什么
2016/06/15 Javascript
Vuejs第八篇之Vuejs组件的定义实例解析
2016/09/05 Javascript
vue.js组件vue-waterfall-easy实现瀑布流效果
2017/08/22 Javascript
vue+springmvc导出excel数据的实现代码
2018/06/27 Javascript
vue 下列表侧滑操作实例代码详解
2018/07/24 Javascript
微信小程序数据分析之自定义分析的实现
2018/08/17 Javascript
H5+C3+JS实现双人对战五子棋游戏(UI篇)
2020/05/28 Javascript
Vue组件模板的几种书写形式(3种)
2020/02/19 Javascript
python常规方法实现数组的全排列
2015/03/17 Python
详解Python中open()函数指定文件打开方式的用法
2016/06/04 Python
Python彩色化Linux的命令行终端界面的代码实例分享
2016/07/02 Python
Flask框架的学习指南之开发环境搭建
2016/11/20 Python
详解Python中for循环是如何工作的
2017/06/30 Python
Python基础练习之用户登录实现代码分享
2017/11/08 Python
Python爬虫实战:分析《战狼2》豆瓣影评
2018/03/26 Python
Python中__slots__属性介绍与基本使用方法
2018/09/05 Python
python 用所有标点符号分隔句子的示例
2019/07/15 Python
Python面向对象中类(class)的简单理解与用法分析
2020/02/21 Python
canvas探照灯效果的示例代码
2018/11/30 HTML / CSS
美国复古街头服饰精品店:Need Supply Co.
2017/02/22 全球购物
Waterford美国官网:爱尔兰水晶制品品牌
2017/04/26 全球购物
英国顶级家庭折扣店:The Works
2017/09/06 全球购物
初始化了一个没有run()方法的线程类,是否会出错?
2014/03/27 面试题
初中生自我评价
2014/02/01 职场文书
2015年教研室工作总结范文
2015/05/23 职场文书
2015团员个人年度总结
2015/11/24 职场文书