Jquery 日期选择器限制日期，例如 2222222/33333/444444

Posted 2023-05-09

【中文标题】Jquery 日期选择器限制日期，例如 2222222/33333/444444

【英文标题】：Jquery date picker restrict dates like 2222222/33333/444444

【发布时间】：2012-04-17 22:50:00

【问题描述】：

我在我的 MVC 3 + Razor 项目中使用 Jquery Date Picker。

我已经成功地使用它并将其与我的项目集成。

现在使用日期选择器我可以看到它不允许使用 a,b...@#,$,%.. 等字符。但它确实允许数字，理解我的意思看截图，

我认为我需要对 jquery 本身进行一些更改，但我不知道在哪里。请帮我解决这个问题。

在 marcolinux 的帮助下，我使用了 http://keith-wood.name/uiDatepickerValidation.html，现在我将它添加到我的脚本中

        $(form).validate(
        rules: 
        startDate: 
        dpDate: true
        
        
        );

并导入此链接

 <script src="../../Scripts/jquery.ui.datepicker.validation.js" type="text/javascript"></script>

我现在在这方面取得了更大的进步 在我的文本框中使用 class="dpDate" 现在我可以在我的文本框上获得一个红色边框以进行输入，例如 1212635245 111/12313/12313

现在我需要知道的最后一部分是如何在文本框旁边显示错误消息。

【参考方案1】：

您似乎担心在文本框中“键入”的日期。您可以在 datepicker 触发的 onClose 事件中挂钩错误检查函数：

允许您在日期选择器关闭时定义自己的事件， 是否选择日期。该函数接收选定的 日期作为文本（'' 如果没有）和 datepicker 实例作为参数。 this 指的是关联的输入字段。

当用户在文本框中输入内容时，日期选择器将打开。当用户选择日期（有效）或控件失去焦点（日期可能有效也可能无效）时，将触发 onClose 事件。然后您可以检查事件处理程序中的日期：

$("#datepicker").datepicker(
    onClose: function(dateText, instance) 
        var date;
        try 
            date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, dateText, instance.settings);
        
        catch (e) 
            alert("$.datepicker.parseDate failed");
        
        if (!date) 
            alert("This date is not valid");
            $(this).val("");
        
    
);

Demo here

【参考方案2】：

放入一个属性 readonly="readonly" 应该解决问题:)

【讨论】：

我试过了，但使用它的问题是我无法删除一旦设置的日期:(

我在keith-wood.name/datepick.html 显示的示例中使用只读，现在它可以工作了（跳舞！）

【参考方案3】：

这个插件会满足你的要求

http://keith-wood.name/uiDatepickerValidation.html

例子

Validate date:   2222/22/222
results :   Please enter a valid date

【讨论】：

这看起来很有帮助，让我试试这个

【参考方案4】：

在文本框的按键上试试，

$('#ID').keypress(function (event) if (event.charCode >= 48 && event.charCode <= 57 && this.value.length < 10 || event.charCode == 47 && (this.value.length == 2 || this.value.length == 5)) if ((this.value.length == 2 || this.value.length == 5) && event.charCode != 47) $(this).val(this.value + "/"); else event.preventDefault(); );