今天碰到一个Bug,在IE8中,日期验证失效,输入正确的日期格式也会验证失败,提示:xxx必须是日期格式(the field xxx must be a date)
最终找到问题所在:jquery.validate.js
// http://docs.jquery.com/Plugins/Validation/Methods/date date: function( value, element ) { return this.optional(element) || !/Invalid|NaN/.test(new Date(value).toString()); },
这段代码会有什么问题呢:在IE6,7,8 newData('2013-08-13') 是会返回 NaN 的,所以会验证通不过。
将上面的代码改为下面的代码就不会出错了
date: function( value, element ) { return this.optional(element) || !/^\d{4}[\/\-]\d{1,2}[\/\-]\d{1,2}$/.test(new Date(value).toString()); },
当然不建议在原来插件中修改,复制一个新的文件,改名为jquery.validate.plus.js,将该文件中的方法改了,然后在页面引用的时候做一个浏览器的判断:
<!--[if lt IE 9]> <script type="text/javascript" src="@Url.Content("~/Scripts/jquery.validate.plus.js")"></script> <![endif]-->
这样就解决问题了。但要注意JS的载入顺序:
<script type="text/javascript" src="/Scripts/jquery.validate.js"></script> <script type="text/javascript" src="/Scripts/jquery.validate.plus.js"></script>
注:
[if lt IE 9]是指IE版本小于IE9的,对IE CSS hack不熟悉的请阅读:http://js8.in/381.html
朋友们,多添加一个JS,按理来说后者会覆盖前者,问题是能够的,但是也许会导致其它莫名其妙的问题,所以为了妥善起见,你只需要在页面上加入以下代码就可以解决这个Bug,而且不会有任何副作用哦。
<!--[if lt IE 9]> <script type="text/javascript"> $(function () { $.validator.methods.date = function(value, element) { return this.optional(element) || !/^\d{4}[\/\-]\d{1,2}[\/\-]\d{1,2}$/.test(new Date(value).toString()); }; }); </script> <![endif]-->