验证输入到文本框中的时间

Question

I have a textbox in which user can enter time (eg: 01:00) and also a drop down box for entering AM/PM fields. (Since the AM/PM field is used, 12-hour time format is used.)

The text box allows a max entry of 5 chars only (eg: 01:00).

1. How can I set the 3rd char as a default a colon : , so that the user simply has to enter only the time.
2. How to check if the time entered by the user is numeric or not?.
3. Autocomplete feature: for example, if the user enters 1 then it would automatically be set to 01:00
4. JavaScript Validations for 12-hour format. Eg: if user enters 13:00 then it should change to 01:00
5. How can I append the text box time values with the am/pm value selected in the drop down box?.
6. Once the values are appended, automatically populate another text box (text box 2) with the result. Eg: 01:00 + pm should be set as 01:00p in the new text box (text box 2).

Any help would be appreciated.

Answer 1

1. Better to have textbox with size and maxlength of 2 named "txtHours", colon as label (span tag) and another textbox named "txtMinutes". Much easier to manage.
2. Instead of checking, have onkeypress code that returns false when the key pressed is not a number thus allowing only digits.
3. Best be done in the onblur event, if the value is less than 10 add zero in the beginning.
4. Pretty simple script, though not trivial - use % operator.
5. Not sure what you mean? Append where?
6. document.getElementById("textbox2").value = strAppendedText;

That's the general idea, let me know if you need help implementing something best give it a try yourself first.