Thursday, 15 January 2015

Numbers only textbox using JQuery



// Items marked for numbers should remain numbers only
$(".numbersonly").keydown(function(event) {
 // Allow: backspace, delete, tab, escape, and enter
 if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 13 ||
   // Allow: Ctrl+A
  (event.keyCode == 65 && event.ctrlKey === true) ||
   // Allow: home, end, left, right
  (event.keyCode >= 35 && event.keyCode <= 39)) {
    // let it happen, don't do anything
    return;
 }
 else {
  // Ensure that it is a number and stop the keypress
  if (event.shiftKey || (event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105 )) {
   event.preventDefault();
  }
 }
});


Simply add the class “numbersonly” to your HTML5 textbox, and this JQuery function takes care of the rest, making sure that textbox only allows the user to enter in numbers.

Regards,

Twitter

Page Hits