为什么 jquery-ui-datepicker 接受来自键盘的无效值答案

【问题标题】：why jquery-ui-datepicker accepts invalid values from keyboard为什么 jquery-ui-datepicker 接受来自键盘的无效值
【发布时间】：2018-09-21 06:40:47
【问题描述】：

我正在使用 jquery UI 日期选择器来获取具有最小和最大日期范围值的日期，它正在使用日期选择器小部件选择日期，但它使用键盘获取无效值。我想通过键盘和鼠标获取日期。请帮助我获取有效日期值或显示无效日期值的错误消息。

datepicker

【问题讨论】：

可以参考链接：keith-wood.name/uidatepickervalidation.html
据我所知，日期选择器本身不会验证您在文本框中输入的内容。它只是一个设计用于鼠标的图形工具。您需要编写自己的验证代码来处理键盘输入 - 输入直接进入文本框，它根本不与 datepicker 控件交互。
感谢您的 cmets，我正在使用 wordpress 网站，并且我使用联系表单 7 插件创建了表单，对于日期字段，我仅使用 UI 日期选择器。我已经按照keith-wood.name/uidatepickervalidation.html 的步骤进行验证字段现在的问题是，它仅在更改字段时显示错误消息，但提交的表单使用无效值。

标签： javascript jquery jquery-ui-datepicker

【解决方案1】：

您可以使用如下代码：

<script type="text/javascript">
    $(".datePicker").datepicker({
        dateFormat: 'd/mm/yy',
        changeMonth: true,
        changeYear: true,
        firstDay: 1,
        minDate: Date.parse("1900-01-01"),
        maxDate: Date.parse("2100-01-01"),
        yearRange: "c-90:c+150"
    });

    $(function () {
        $.validator.addMethod(
                "date",
                function (value, element) {
                   // Here you can set date range    
                    var minDate = Date.parse("1900-01-01");
                    var maxDate = Date.parse("2100-01-01");
                    var valueEntered = Date.parse(value);

                    if (valueEntered < minDate || valueEntered > maxDate) {
                        return false;
                    }
                    return !/Invalid|NaN/.test(new Date(minDate));
                },
                "Please enter a valid date!"
                );
    });
</script>

【讨论】：