Jquery 日期选择器 Chrome

Question

在使用 jQuery UI Datepicker 时，我们在 Google Chrome 中使用时遇到一个问题： 当我们输入大于 12 的日期时，它不接受它作为有效日期，这是因为 chrome 认为日期格式是 mm/dd/yyyy。我们尝试通过添加代码来尝试将日期设置强制为 dd/mm/yyyy 来解决

$('.date').datepicker({ dateFormat: "dd/mm/yy" });

此问题是否有任何方法可以解决此问题，以便我们的日期选择器将接受 dd/mm/yyyy 值？ 我们仅在 google Chrome 中遇到此问题，日期修复适用于 Firefox、ie 和 Firefox。野生动物园。 我们正在使用 ASPX & MVC3 与这个项目。

如果有人可以解决我们的问题，那就太好了，

谢谢

Answer 1

我遇到了同样的问题，并且与所有基于 Webkit 的网络浏览器有关。如果您设置大写 M，文本框将显示带有字母的飞蛾。对我来说最好的解决方案是覆盖 jquery.validate.js 中的验证日期函数

创建 jquery.validate.date.js 并确保它在 jquery.validate.js 之后加载

将以下代码添加到 jquery.validate.date.js

$(function() {
    $.validator.methods.date = function (value, element) {
        if ($.browser.webkit) {

            //ES - Chrome does not use the locale when new Date objects instantiated:
            var d = new Date();

            return this.optional(element) || !/Invalid|NaN/.test(new Date(d.toLocaleDateString(value)));
        }
        else {

            return this.optional(element) || !/Invalid|NaN/.test(new Date(value));
        }
    };
});

Answer 2

user1011138 解决方案对我不起作用，因为 .toLocaleDateString(value) 无法解析 value 字符串，

这是我想出的解决方案 =>
在 jquery.validate.js 中找到此函数定义：“date: function (value, element)”并将代码替换为：

// http://docs.jquery.com/Plugins/Validation/Methods/date
date: function (value, element) {
    var d = value.split("/");
    return this.optional(element) || !/Invalid|NaN/.test(new Date((/chrom(e|ium)/.test(navigator.userAgent.toLowerCase())) ? d[1] + "/" + d[0] + "/" + d[2] : value));
},

Answer 3

上述解决方案不起作用，因为 jquery 浏览器检查已被弃用，抛出 jquery.validate.min.js Uncaught TypeError：无法读取未定义的属性“webkit”。检查元素 DateOfBirth 时发生异常，请检查“日期”

在我的项目中，我将 momentjs 与 bootstrap datetimepicker，所以这个解决方案效果很好：

 $(function () {
    $.validator.methods.date = function (value, element) {
        return this.optional(element) || moment(value, 'DD/MM/YYYY').isValid();
  };
});

加载 jquery.validate() 后立即调用它

Answer 4

您必须使用“en-GB”日期验证覆盖默认的“en-US”日期验证。

• 'en-US' => '月/日/年'
• 'en-GB' => 'dd/mm/yy'

解决方案：

在您的项目中添加一个“jquery.validate.date.js”文件，并将以下代码放入其中：

//To Fix jQuery date format 'en-GB' validation problem in Chrome
$(function () {
    $.validator.addMethod(
        "date",
        function (value, element) {
            var bits = value.match(/([0-9]+)/gi), str;
            if (!bits)
                return this.optional(element) || false;
            str = bits[1] + '/' + bits[0] + '/' + bits[2];
            return this.optional(element) || !/Invalid|NaN/.test(new Date(str));
        },
        "Please enter date in valid format [dd/mm/yyyy]"
    );
});

并确保它在“jquery.validate”之后加载.min.js'：

<script type="text/javascript" src="/Scripts/jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery.validate.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery.validate.date.js"></script>

Answer 5

创建一个新的 jquery.validate.date.js 文件。

将以下代码粘贴到文件中。

 $(function () {
    $.validator.methods.date = function (value, element) {
      if ($.browser.webkit) {
        var d = new Date();
        return this.optional(element) || !/Invalid|NaN/.test(new Date(d.toLocaleDateString(value)));
      }
      else {
        return this.optional(element) || !/Invalid|NaN/.test(new Date(value));
    }
  };
});

现在确保该文件在 jquery.validate.js 文件之后加载。

Answer 6

 $.validator.methods.date = function (value, element) {                
            if ($.browser.webkit) {                    
                var d = value.split("/");   
                return this.optional(element) || !/Invalid|NaN/.test(new Date((/chrom(e|ium)/.test(navigator.userAgent.toLowerCase())) ? d[1] + "/" + d[0] + "/" + d[2] : value));
              }
            else {
                return this.optional(element) || !/Invalid|NaN/.test(new Date(value));
            }
        };