关于验证:jQuery .validate-在Internet Explorer中验证日期

jQuery .validate - validating dates in Internet Explorer

我已经了解到IE使用jQuery Validate插件(https://jqueryvalidation.org/)来验证日期的困难方式。

我的规则只是starttime: {required: true, date: true},但我的格式是DD-MMM-YYYY hh:mm a,即2017年8月31日上午9:43。

这在其他浏览器中也可以使用,但是IE表示这是一个无效的日期。请注意,验证正在其他字段上进行。

这里有一些很好的答案:使用jQuery验证插件的自定义日期格式,但是具体来说,如何在IE中验证我的日期格式?

我的猜测是我需要添加一个自定义方法,但是其中应该包含什么?正则表达式还是自定义日期,如何? RegEx可以在不验证日期本身的情况下验证日期格式(例如32/01/2017),因为此页面使用日期选择器,并且用户无法直接输入数据。

编辑(包括实际代码):

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<script type="text/javascript" src="js/plugins/jquery-validate/jquery.validate.min.js">


    $(document).ready(function(){

        if ($("#newinspectionform").length > 0) {
            var validate = $("#newinspectionform").validate({
                errorClass:"has-error",
                validClass:"",
                errorElement:"span",
                ignore: [],
                errorPlacement: function (error, element) {
                    $(element).after(error);
                    $(element).parents(".form-group").addClass("has-error");
                },
                highlight: function (element, errorClass) {
                    $(element).parents(".form-group").removeClass("has-success").addClass(errorClass);
                },
                unhighlight: function (element, errorClass, validClass) {
                    $(element).parents(".form-group").removeClass(errorClass).addClass(validClass);
                },
                rules: {
                    propertyid: {required: true},
                    type: {required: true},
                    starttime: {required: true, date: true},
                    endtime: {required: true, date: true}
                }
            });
        }

    ... other stuff


我使用自定义日期方法解决了这个问题。我需要这样做,因为我的格式需要保留为DD-MMM-YYYY hh:mm a,即2017年8月31日上午9:43。

1
2
3
4
5
6
7
8
    $.validator.addMethod(
       "inspDateTime",
        function(value, element) {
            // put your own logic here, this is just a (crappy) example
            return value.match(/^(0?[1-9]|[12][0-9]|3[0-1])[/., -](0?[1-9]|1[0-2]|[a-zA-Z]{3})[/., -](19|20)?\\d{2} (0?[1-9][012]?:[0-5][0-9] [ap]m)$/);
        },
       "Please enter a valid date."
    );

我不确定为什么Internet Explorer无法验证该日期,但是上述正则表达式可在IE中使用。将此答案归功于起始正则表达式:https://stackoverflow.com/a/17392795/2066625


编辑:包括日期选择器

尝试一下。它可以在带有datePicker的IE中使用。您是否也在尝试设定时间?如果是这样,我知道有人为datetimePicker创建了一个插件。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<!doctype html>
<html>
<head>
</head>
<body>
    <form>
        <input type="date" class="left" id="starttime" name="starttime">
        <br/>
        <input type="submit" value="Validate!">
    </form>
</body>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.11.1.min.js">
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/jquery.validate.min.js">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js">

   //datePicker Set format
   $('#starttime').datepicker({
      dateFormat: 'yy-mm-dd'
   }).datepicker("setDate", new Date());


   var validator = $("form").validate ({
       rules: {
            starttime: {required: true, date: true}
      },
       messages: {
            starttime:"Please enter a valid start date"
       }
    });