javascript - HTML表单中的时间输入验证

我正在尝试将日期验证添加到HTML表单中。我希望输入的日期采用HH:MM:SS而不是HH:MM格式。
如果我以错误的格式输入日期（例如HH:MM），则会显示一条警告，说明：
“日期时间格式应为HH:MM:SS。”
你能帮我更正一下密码吗？
以下是我的JavaScript代码：

if (date.match(regex pattern)) {
    alert("Valid date");
} else {
    alert("Invalid date: date should be in HH:MM:SS format!");
}

验证输入时间的正确方法是什么？

最佳答案

此测试HH:MM:SS模式，不测试大约实际的小时、分钟和秒数：
HTML代码：

<form onsubmit="return validate()">
    <input type="text" id="date" />
    <input type="submit" />
</form>

Javascript代码：

function validate() {
    var date = document.getElementById("date").value;
    if (date.match(/^[0-9]{2}:[0-9]{2}:[0-9]{2}$/)) {
        alert("Valid date");
    } else {
        alert("Invalide date: dat should be in HH:MM:SS format!");
    }
    return false;
}

您可以在这里在线试用：http://jsfiddle.net/OscarGarcia/fow3htwz/1/
记住：秒数和分钟数未经测试！有人可能会试图介绍这个错误的时间：43:87:91和将（坏）通过模式！
编辑：测试小时、分钟和秒范围
此代码的工作方式很有魅力：）http://jsfiddle.net/OscarGarcia/fow3htwz/2/

function validate() {
    var date = document.getElementById("date").value;
    if (date.match(/^([0-1][0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]$/)) {
        alert("Valid date");
    } else {
        alert("Invalide date: dat should be in HH:MM:SS format!");
    }
    return false;
}

使用test代替match进行新编辑
在线试用：http://jsfiddle.net/OscarGarcia/fow3htwz/4/

function validate() {
    var date = document.getElementById("date").value;
    var pattern = /^([0-1][0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]$/;
    if (pattern.test(date)) {
        alert("Valid date");
    } else {
        alert("Invalide date: dat should be in HH:MM:SS format!");
    }
    return false;
}

谨致问候。

关于javascript - HTML表单中的时间输入验证，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/28743300/