Chrome中不显眼的validation不会以dd / mm / yyyy进行validation
我试图在不同的浏览器中使用dateselect器的最简单的情况。 我怀疑我做了一件非常简单的事情，但经过大量的search，我还没有find解决办法。 下面是一些代表我正在尝试的示例代码。
如果我使用Chrome（v12.0.742.122）并从13/08/2011挑选一个date，jQueryvalidation逻辑将不会允许页面提交，即使我明确指定格式为“dd / mm / YY”。
如果我将格式更改为“dd / M / yy”，并select一个像2011年8月13日那样的date，它可以在Chrome中运行，但不会在IE中提交给我（v8.0.7600.16385）。 在FireFox（v3.6.18）中，这两种格式都可以工作。
我需要什么validation脚本才能在Chrome中支持“dd / mm / yy”date格式？
<html> <head> <link rel="stylesheet" type="text/css" href="jquery-ui.css" /> <script type="text/javascript" src="jquery-1.4.4.js"></script> <script type="text/javascript" src="jquery.validate.js"></script> <script type="text/javascript" src="jquery.validate.unobtrusive.js"></script> <script type="text/javascript" src="jquery-ui.js"></script> <script type="text/javascript"> $(document).ready(function () { $('.date').datepicker({ dateFormat: 'dd/mm/yy' }); $.validator.addMethod("dateRule", function(value, element) { return true; }, "Error message"); }); </script> </head> <body> <form> Date: <input type="text" name="myDate" class="date dateRule" /> <input type="submit" /> </form> </body> </html> 四个小时后，我终于偶然发现了答案 。 出于某种原因，Chrome浏览器似乎有一些内置的偏好，使用美国的date格式，其中IE和FireFox是明智的，并在操作系统上使用区域设置。
jQuery.validator.methods["date"] = function (value, element) { return true; }
你可以使用这里提供的Globalize.js插件： https ： //github.com/jquery/globalize
然后简单地重新定义你的网站的主脚本文件中的validation方法就像这样（避免编辑jquery.validate.js库文件，以后可能需要更新它）：
$.validator.methods.date = function (value, element) { return this.optional(element) || Globalize.parseDate(value, "d/M/y", "en"); }
我知道我晚了一点，但这里是我用来validationChrome的解决scheme，不接受英国格式的date。 一个简单的即插即用validation，它不依赖任何插件或修改任何文件。 它将接受在1/1/1900和31/31/2999之间的任何date，所以美国或英国的格式。 显然有无效的date，将潜行过去，但你可以调整正则expression式到你的心的内容。 这满足了我的需求，因为它将用于站点的低stream量区域，并进行服务器端validation。 有问题的网站的区域是用ASP.net MVC构build的。
jQuery.validator.methods.date = function(value, element) { var dateRegex = /^(0?[1-9]\/|[12]\d\/|3[01]\/){2}(19|20)\d\d$/; return this.optional(element) || dateRegex.test(value); };
看起来像JQuery团队已经提出这个问题。
https://github.com/jzaefferer/jquery-validation/issues/153
看起来现在的解决方法是在additional-methods.js中使用dateITA
它看起来像这样：
jQuery.validator.addMethod( "dateITA", function(value, element) { var check = false; var re = /^\d{1,2}\/\d{1,2}\/\d{4}$/; if( re.test(value)){ var adata = value.split('/'); var gg = parseInt(adata[0],10); var mm = parseInt(adata[1],10); var aaaa = parseInt(adata[2],10); var xdata = new Date(aaaa,mm-1,gg); if ( ( xdata.getFullYear() == aaaa ) && ( xdata.getMonth () == mm - 1 ) && ( xdata.getDate() == gg ) ) check = true; else check = false; } else check = false; return this.optional(element) || check; }, "Please enter a correct date" );
如果你添加了validation器，你可以将你的datepicker附加到“.dateITA”类。
到目前为止，这对我来说能够帮助我超越Chrome这个愚蠢的问题。
这仍然是.net mvc4中的一个问题，尽pipe在jQueryvalidation插件中明确的文档不使用它， EditorFor DateTime仍然会生成data-val-date属性！ 希望微软修复这个和data-val-date是再也听不到了！
在此期间，您可以通过modernizr使用build议的库：
yepnope({ test: isNaN(Date.parse("23/2/2012")), nope: 'ajax/jquery.validate/1.13.0/additional-methods.min.js', complete: function () { $.validator.methods.date = $.validator.methods.dateITA } });
或者如果不想使用yepnope / modernizr，并且去掉dateITA方法的UTC组件（如果使用这个库来input当地时间，date不会总是在月份的第一天或最后一天进行validation，除非在格林威治线 – 即UTC +0）：
(function ($) { var invokeTestDate = function () { return $.validator.methods.date.call({ optional: function () { return false; }, (new Date(2012,8,23)).toLocaleDateString(), null); }; if (invokeTestDate()) { return; } // http://docs.jquery.com/Plugins/Validation/Methods/date $.validator.methods.date = function (value, element) { //ES - Chrome does not use the locale when new Date objects instantiated: //return this.optional(element) || !/Invalid|NaN/.test(new Date(value)); var d = new Date(); return this.optional(element) || !/Invalid|NaN/.test(new Date(d.toLocaleDateString(value))); } })(jQuery);
我们使用以下工作来开展我们的项目。
if ($.validator) { $.validator.addMethod("date", function (value, element, params) { if (this.optional(element)) { return true; } var ok = true; try { $.datepicker.parseDate("dd/mm/yy", value); } catch (err) { ok = false; } return ok; }); }
这个代码可以帮助你。
$.validator.addMethod( "date", function(value, element) { var check = false; var re = /^\d{1,2}\/\d{1,2}\/\d{4}$/; var reBR = /^\d{4}\-\d{1,2}\-\d{1,2}$/; if( re.test(value)){ var adata = value.split('/'); var gg = parseInt(adata[0],10); var mm = parseInt(adata[1],10); var aaaa = parseInt(adata[2],10); var xdata = new Date(aaaa,mm-1,gg); if ( ( xdata.getFullYear() == aaaa ) && ( xdata.getMonth () == mm - 1 ) && ( xdata.getDate() == gg ) ) check = true; else check = false; } else if( reBR.test(value)){ var adata = value.split('-'); var aaaa = parseInt(adata[0],10); var mm = parseInt(adata[1],10); var gg = parseInt(adata[2],10); var xdata = new Date(aaaa,mm-1,gg); if ( ( xdata.getFullYear() == aaaa ) && ( xdata.getMonth () == mm - 1 ) && ( xdata.getDate() == gg ) ) check = true; else check = false; } else check = false; console.log(check); return this.optional(element) || check; }, "Por favor insira uma data válida" );
应该改变你在validation中定义的dateRule方法（正则expression式只是一个简单的例子）：
$.validator.addMethod( "dateRule", function(value, element) { return value.match(/^\d\d?\/\d\d?\/\d\d$/); }, "Please enter a date in the format dd/mm/yy" );
你可以切换任何你想要的正则expression式。 我从这里得到这个支持M / D / YY或M / D / YYYY或MM / DD / YYYY或MM / DD / YY的date的正则expression式：1/1/1920到12/31/2019; 2月29日和30日总是允许的
^((0?[13578]|10|12)(-|\/)(([1-9])|(0[1-9])|([12])([0-9]?)|(3[01]?))(-|\/)((19)([2-9])(\d{1})|(20)([01])(\d{1})|([8901])(\d{1}))|(0?[2469]|11)(-|\/)(([1-9])|(0[1-9])|([12])([0-9]?)|(3[0]?))(-|\/)((19)([2-9])(\d{1})|(20)([01])(\d{1})|([8901])(\d{1})))$
我也find了一个似乎适用于任何文化的解决scheme。
http://devdens.blogspot.com/2011/11/jquery-validation-fix-for-date-format_29.html
它需要你修改实际的jquery.valdiation.min.js文件，但到目前为止它为我工作。
这是唯一适用于我的解决scheme： http : //www.codeproject.com/Tips/579279/Fixing-jQuery-non-US-Date-Validation-for-Chrome
jQuery.extend(jQuery.validator.methods, { date: function (value, element) { var isChrome = window.chrome; // make correction for chrome if (isChrome) { var d = new Date(); return this.optional(element) || !/Invalid|NaN/.test(new Date(d.toLocaleDateString(value))); } // leave default behavior else { return this.optional(element) || !/Invalid|NaN/.test(new Date(value)); } } });
在调用你的validation文件后，我发现这个错误的最简单的修正是下面的代码片段;
jQuery.validator.methods["date"] = function (value, element){ var shortDateFormat = "dd/mm/yy"; var res = true; try { $.datepicker.parseDate(shortDateFormat, value); } catch (error) { res = false; } return res; }
即使在2016年发现的版本，仍然有这个问题没有在Chrome上面的代码，而不是Firefox。
这是我的首选解决scheme，因为它不需要任何额外的库或插件的工作。
我发现这个代码片段，而谷歌search这个问题。
