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

Question

谷歌搜索后,搜索此网站以及jQuery发现没有简单的方法来验证时间价值.

根据事物的外观,它建议使用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.");

小提琴

文档.

您还可以在单​​个正则表达式(源)中对其进行总结:

([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" />

小提琴

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.");

演示