Show Input tag(textbox control) with two digit format in HTML5

Question

How can I make an input tag, that always accepts two digits? like 01, 02, 03 etc up to 24. A leading zero should be present in case of single digits(0 to 9)

<input id="hourInput" type="number" min="1" max="24" step="1"  />

Answer 1

Unfortunately it is not possible, in pure HTML5, to achieve this. Javascript will be required...

<input id="hourInput" type="number" min="1" max="24" step="1" onchange="if(parseInt(this.value,10)<10)this.value='0'+this.value;" />

EDIT: Since this answer seems to get good trafic, I'd like to add the fact that the approach I have suggested is a naïve way to do it and will only correctly work with a min attribute higher than -9. If the number goes lower, the 0 will still get added resulting in 0-234 when the user enter a negative value of 234.