<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script src="../Scripts/jquery-1.10.2.js"></script> <style type="text/css"> body { font-size: 9pt; font-family: Arial; } </style> <script type="text/javascript"> var specialKeys = new Array(); specialKeys.push(8); //Backspace function IsNumeric(e) { var keyCode = e.which ? e.which : e.keyCode var ret = ((keyCode >= 48 && keyCode <= 57) || specialKeys.indexOf(keyCode) != -1); document.getElementById("error").style.display = ret ? "none" : "inline"; return ret; } $(document).ready(function () { // Setting focus on first textbox $('input:text:first').focus(); // binding keydown event to textbox $('input:text').bind('keydown', function (e) { // detecting keycode returned from keydown and comparing if its equal to 13 (enter key code) if (e.keyCode == 13) { // by default if you hit enter key while on textbox so below code will prevent that default behaviour e.preventDefault(); // getting next index by getting current index and incrementing it by 1 to go to next textbox var nextIndex = $('input:text').index(this) + 1; // getting total number of textboxes on the page to detect how far we need to go var maxIndex = $('input:text').length; // check to see if next index is still smaller then max index if (nextIndex < maxIndex) { // setting index to next textbox using CSS3 selector of nth child $('input:text:eq(' + nextIndex + ')').focus(); } } }); }); </script> </head> <body> Numeric Value: <input type="text" id="text1" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;" /> <input type="text" id="text2" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;" /> <input type="text" id="text3" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;" /> <span id="error" style="color: Red; display: none">* Input digits (0 - 9)</span> </body> </html>
More information:
http://www.aspsnippets.com/Articles/Allow-only-numeric-value-numbers-in-TextBox-using-JavaScript.aspx