javascript - jQuery - check proper time format - Stack Overflow

admin管理员组

文章数量:1208155

I have an input field where the user enters a time in format mm:hh. The format is specified inside the field (default value 09:00) but I still want to perform a client-side check to see if the format is correct.

Since the existing client-side validation is in jQuery, I'd like to keep this in jQuery as well.

I'm mainly a PHP programmer so I need some help writing this one in an optimal manner.

I know I can check each individual character (first two = digits, third = ':', last two = digits) but is there a way to do it more elegantly, while also checking the hour count is not larger than 23 and the minute count isn't larger than 59?

In PHP I would use regular expressions, I assume there's something similar for jQuery?

Something like this makes sense to me:

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

But I'm not too familiar with jQuery syntax so I'm not sure what to do with it.

I have an input field where the user enters a time in format mm:hh. The format is specified inside the field (default value 09:00) but I still want to perform a client-side check to see if the format is correct.

Since the existing client-side validation is in jQuery, I'd like to keep this in jQuery as well.

I'm mainly a PHP programmer so I need some help writing this one in an optimal manner.

I know I can check each individual character (first two = digits, third = ':', last two = digits) but is there a way to do it more elegantly, while also checking the hour count is not larger than 23 and the minute count isn't larger than 59?

In PHP I would use regular expressions, I assume there's something similar for jQuery?

Something like this makes sense to me:

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

But I'm not too familiar with jQuery syntax so I'm not sure what to do with it.

• javascript
• jquery

Share Improve this question Follow asked Apr 16, 2012 at 11:56 sveti petarsveti petar 3,7871414 gold badges7676 silver badges157157 bronze badges

Add a comment  | 

4 Answers 4

Sorted by: Reset to default 12

you can use regex in JavaScript too:

http://www.w3schools.com/jsref/jsref_obj_string.asp

use .search() - http://www.w3schools.com/jsref/jsref_search.asp

or .match() - http://www.w3schools.com/jsref/jsref_match.asp

or .replace() - http://www.w3schools.com/jsref/jsref_replace.asp

EDIT:

<script>
    var regexp = /([01][0-9]|[02][0-3]):[0-5][0-9]/;
    var correct = ($('input').val().search(regexp) >= 0) ? true : false;
</script>

EDIT2:

here the documentation of regexpobject in javascript:

http://www.w3schools.com/jsref/jsref_obj_regexp.asp

<script>
    var regexp = /([01][0-9]|[02][0-3]):[0-5][0-9]/;
    var correct = regexp.test($('input').val());
</script>

EDIT3:

fixed the regexp

In JavaScript, regexes are delimited by /. So you would do...

var isValidTime = /([01]?[0-9]|2[0-3]):[0-5][0-9]/.test(inputString);

Your regex seems to make sense for validating any 24H time in HH:mm format. However as I state in my comment under Andreas's answer - this will return true if any part of the string matches. To make it validate the entire string, use anchors to match the start and end of the string also eg...

var isValidTime = /^([01]?[0-9]|2[0-3]):[0-5][0-9]$/.test(inputString);

To actually pull the matches you would need to use the string.match JS function.

Oh - and please be aware that jQuery is Javascript - it's just a library of very useful stuff! However this example contains no reference to the jQuery library.

In JavaScript you can use yourstring.match(regexp) to match a string against a regular expression.

I have very limited RegEx-experience, so I cant help you with the pattern, but if you have that set .match() should be all it takes.

A different approach, but using an extra javascript lib instead of regular expressions:

var valid = moment(timeStr, "HH:mm", true).isValid();

I guess if you already use moment.js in your project, there's no downside.

And since you didn't specifically request an answer using regular expressions, I think it's valid to mention.

本文标签： javascriptjQuerycheck proper time formatStack Overflow