Как проверить с помощью Javascript текст ввода с часами и минутами
Мне нужно создать HTML-форму с текстовым полем ввода для часов и минут.
Что-то вроде:
Имя: [Foo]
Фамилия: [Бар]
Задача: [Спам]
Часы минут: [00:15] < - текст ввода.
Как я могу помочь/проверить/заставить пользователя компилировать значения часов и минут в разрешенном формате HH: mm с помощью Javascript? *
Допустимый диапазон времени: от 00:00 до 23:59
* Я не могу использовать JQuery, и, конечно же, я дважды проверю серверную сторону отправленного значения
Ответы
Ответ 1
Либо со следующим регулярным выражением:
^([0-1]?[0-9]|2[0-4]):([0-5][0-9])(:[0-5][0-9])?$
Или вручную, но я настоятельно рекомендую RegExp:)
Простой пример:
<SCRIPT TYPE="text/JavaScript">
function validateHhMm(inputField) {
var isValid = /^([0-1]?[0-9]|2[0-4]):([0-5][0-9])(:[0-5][0-9])?$/.test(inputField.value);
if (isValid) {
inputField.style.backgroundColor = '#bfa';
} else {
inputField.style.backgroundColor = '#fba';
}
return isValid;
}
</SCRIPT>
<FORM METHOD="POST">
<input type="text" onchange="validateHhMm(this);" />
</FORM>
Ответ 2
RegExp из первого ответа не соответствует запросу OP.
^([0-1]?[0-9]|2[0-4]):([0-5][0-9])(:[0-5][0-9])?$
Должно быть
^([0-1][0-9]|2[0-3]):([0-5][0-9])$
Соответствует 00-19 или 20-23: 00-59
OP запросила проверку HH: MM в диапазоне 00:00 - 23:59
Нет секунд. 24:00 не может быть действительным. Двойные цифры для ввода часа и минуты.
Ответ 3
<HTML>
<Head>
<script language="javascript">
function validateTime(obj)
{
var timeValue = obj.value;
if(timeValue == "" || timeValue.indexOf(":")<0)
{
alert("Invalid Time format");
return false;
}
else
{
var sHours = timeValue.split(':')[0];
var sMinutes = timeValue.split(':')[1];
if(sHours == "" || isNaN(sHours) || parseInt(sHours)>23)
{
alert("Invalid Time format");
return false;
}
else if(parseInt(sHours) == 0)
sHours = "00";
else if (sHours <10)
sHours = "0"+sHours;
if(sMinutes == "" || isNaN(sMinutes) || parseInt(sMinutes)>59)
{
alert("Invalid Time format");
return false;
}
else if(parseInt(sMinutes) == 0)
sMinutes = "00";
else if (sMinutes <10)
sMinutes = "0"+sMinutes;
obj.value = sHours + ":" + sMinutes;
}
return true;
}
</script>
</Head>
<Body>
<input type="text" onblur="validateTime(this)">
</Body>
</HTML>
Ответ 4
Как насчет
function validTime(inputStr) {
if (!inputStr || inputStr.length<1) {return false;}
var time = inputStr.split(':');
return time.length === 2
&& parseInt(time[0],10)>=0
&& parseInt(time[0],10)<=23
&& parseInt(time[1],10)>=0
&& parseInt(time[1],10)<=59;
}
Ответ 5
Вы можете использовать что-то вроде jQuery.maskedit
Ответ 6
может быть не лучшим, но это работает для меня. Я возвращаю false, если в этом случае нет ошибок. проверяет как формат, так и значения.
if (value.substr(2,1) === ':') {
if (!value.match(/^\d\d:\d\d/)) {
return "Invalid Format";
}
else if (parseInt(value.substr(0,2)) >= 24 || parseInt(value.substr(3,2)) >= 60) {
return "Invalid Format";
}
else {
return false;
}
}
else {
return "Invalid Format";
}