HTML5 Number Input
http://stackoverflow.com/questions/8354975/how-to-add-maxlength-for-html5-input-type-number-element
by Kiran Duggal
HTML
<input name="myInput_DRS" onkeypress="return isNumeric(event)" oninput="maxLengthCheck(this)" type="text" maxlength="3" min="1" max="999" />
<script>
function maxLengthCheck(object) {
if (object.value.length > object.maxLength) object.value = object.value.slice(0, object.maxLength)
}
function isNumeric(evt) {
var theEvent = evt || window.event;
var key = theEvent.keyCode || theEvent.which;
key = String.fromCharCode(key);
var regex = /[0-9]|\./;
if (!regex.test(key)) {
theEvent.returnValue = false;
if (theEvent.preventDefault) theEvent.preventDefault();
}
}
</script>
CSS
body {
background:#eee;
padding-top: 50px;
text-align;
center;
}
input {
display: block;
margin: auto;
padding: 3px 6px;
width: 100px;
font-family: sans-serif;
font-weight: bold;
font-size: 110%;
outline: 0;
border: 1px solid #444;
background: #f4f4f4;
color: black;
border-radius: 1px;
text-align: center;
box-shadow: 0 2px 8px #bbb, inset 0 0 0 1px white;
}
input:focus {
background: white;
}