Welcome to Bucaro TecHelp!

Bucaro TecHelp
Maintain Your Computer and Use it More Effectively
to Design a Web Site and Make Money on the Web

About Bucaro TecHelp About BTH User Agreement User Agreement Privacy Policy Privacy Site Map Site Map Contact Bucaro TecHelp Contact RSS News Feeds News Feeds

Victims of Sandy Hook

Stop the Slaughter of Innocents. Congress is bought and paid for by gun lunatics and gun promotion groups. If you want to live in a safe America, help buy Congress back for America. Send a donation to Mayors Against Illegal Guns, 909 Third Avenue, 15th Floor New York, NY 10022

JavaScript Code to Restrict Keyboard Entries

Binary Number:

You can restrict form textbox input to only the characters you desire. This example shows how to restrict textbox input characters to only the characters 0 and 1. The character code for 0 is 48, the character code for 1 is 49. The code shown below restricts input to those two characters.

var unicode = e.charCode || e.keyCode;
if(unicode != 48 && unicode != 49) return false;

The character code input from the user's keyboard is stored in the variable unicode and the if statement tests if that code is not equal to 0 and is not equal to 1, if true, it return a false. A return of false means exit this section of code without doing anything else. This effectively restricts the input.

We do want to permit certain other key functions besides 0 and 1. For example we want to allow the character code for backspace (8), tab (9), and delete (46) so that the user can edit their input. To do that we nest the previous ifstatement in another if statement that does not allow those keyCodes to be tested by the first if statement, as shown below.

if(unicode != 8 && unicode != 9 && unicode != 46)
{
  if(unicode != 48 && unicode != 49) return false;
}

All this key input restricting prevents the form from responding to the normal Tab function that allows the user to tab between form elements, which is something that you probably want to preserve, so before letting program flow get to the statements above, I use an if statement to catch the character code for tab (13), and use it to send the focus to the next element in the form. The code for this is shown below.

if(unicode == 13)
{
   document.getElementById("result").focus();
}

Shown below is the entire code for a function to restrict the input from a form text box to only 0 and 1.

<script>
function restrictKey(e)
{
   var unicode = e.charCode || e.keyCode;
   // cause enter key to tab
   if(unicode == 13)
   {
      document.getElementById("result").focus();
   }

   // allow tab and backspace key
   if(unicode != 8 && unicode != 9 && unicode != 46)
   {
     if(unicode != 48 && unicode != 49) return false;
   }
}

function showEntry(form)
{
   alert(form.bindigits.value);
}
</script>

<form action="javascript:return false;">
Binary Number: <input type="text" id="bindigits" size="12" maxLength="12" style="text-align:right" onkeypress="return restrictKey(event)" /><br />
<input type="button" id="result" value="Show" onclick="showEntry(this.form)" />
</form>

You should know enough now to be able to adjust the code for your own purposes. To aid in that, below is a table of some keys and their related character codes.

KeykeyCode
Backspace8
Tab9
Enter13
Shift16
Ctrl17
Alt18
Esc27
Space32
Page Up33
Page Down34
End35
Home36
Left arrow37
Up arrow38
Right arrow39
Down arrow40
PrntScrn44
Insert45
Delete46
0-948-57
A-Z65-90

More Java Script Code:
• JavaScript to Set Checkbox to Readonly
• Easy Moving Popup Code
• Easy Drag n Drop Code
• Java Script Trim Function
• Convert Mixed Number to Decimal
• Java Script Code for Directory File List
• Make Your Own Graphical Digital Clock
• Easy Animated Banners with Java Script
• Put a Music Off Switch on Your Webpage
• Creating Java Script Dynamic or anonymous Functions at Runtime

RSS Feed RSS Feed

Follow Stephen Bucaro Follow @Stephen Bucaro



Web Design Sections

Fire HD
[Site User Agreement] [Privacy Policy] [Site map] [Search This Site] [Contact Form]
Copyright©2001-2016 Bucaro TecHelp 13771 N Fountain Hills Blvd Suite 114-248 Fountain Hills, AZ 85268