HTML5 Number Input

http://stackoverflow.com/questions/8354975/how-to-add-maxlength-for-html5-input-type-number-element

by David Santiago

HTML

<input name="myInput_DRS"
    onkeypress="return isNumeric(event)"
    oninput="maxLengthCheck(this)"
    type = "number"
    min = "1"
    max = "99999" />

<script>
  function maxLengthCheck(object) {
    if (object.value.length > object.max.length)
      object.value = object.value.slice(0, object.max.length)
  }
    
  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;}