Jquery - 验证表单上的时间值 - 正确的方法？

Question

谷歌搜索后，搜索此网站以及jQuery发现没有简单的方法来验证时间值(value)。

从外观来看，它建议使用 addMethod并使用 regexpess 值来检查时间应该是什么样子。

但是决定查看 jquery.validate.js 以及如何检查 dateISO，它看起来更简单，因此我复制了与 dateISO 相关的所有数据并将其命名为 timeISO 和更改字符串以验证时间并使用以下时间字符串

^([01]\d|2[0-3]):[0-5]\d:[0-5]\d$ 

是否有某种原因导致人们不应该修改jquery.validate.js并按照我的方式进行操作？只是有点担心，因为我在谷歌和这个论坛上的所有搜索都从未建议过。

Answer 1

您可以将自定义方法添加到jQuery.validate。可能有一个可用的方法，但我编写了这个 24 小时时间格式验证作为示例:

$.validator.addMethod("time24", function(value, element) {
    if (!/^\d{2}:\d{2}:\d{2}$/.test(value)) return false;
    var parts = value.split(':');
    if (parts[0] > 23 || parts[1] > 59 || parts[2] > 59) return false;
    return true;
}, "Invalid time format.");

Fiddle

Documentation .

您还可以将其总结为单个正则表达式 ( source ):

([01]?[0-9]|2[0-3])(:[0-5][0-9]){2}

如果您使用的是 HTML5，则可以使用 pattern 属性:

<input type="text" pattern="([01]?[0-9]|2[0-3])(:[0-5][0-9]){2}" 
    required="required" placeholder="hh:mm:ss" />

Fiddle

如果您需要与旧版浏览器兼容，请继续使用 jQuery.validate 方法:

$.validator.addMethod("time24", function(value, element) {
    return /^([01]?[0-9]|2[0-3])(:[0-5][0-9]){2}$/.test(value);
}, "Invalid time format.");

Demo