JavaScript allows you to add many special effects to your HTML pages that you simply couldn't do with HTML alone. One of these special effects is disabling the "ENTER" key's function while filling out online forms.
The reason you want to do this is because pressing on the "ENTER" key is the same as clickng on the "SEND" button in the form. Some people try to move from one text field to the other using the "ENTER" key instead of the "TAB" key and accidentally submit the form before they have filled out all of the text fields. Then they go back and fill it out again and you end up getting several emails when one was what you really wanted. Using this script will save you a lot of time sorting out and reading your email.
Below is an example. This form will not send email. I have disabled that part. Pressing the "ENTER" key in the "Email Address" and "Subject Matter" fields is a waste of time. It simply wont do anything. But, in the "Your Comments" field, the "ENTER" key will function just fine. The script is preventing the "ENTER" key from functioning because of the two TYPE="TEXT" elements in the <INPUT> tags below. But, not in the <TEXTAREA> tag.
Below is the source code for this. The red-colored text is what makes this function.
<html>
<head>
<title>The Title Of Your Page Goes Here!</title>
<script language="javascript" type="text/javascript">
<!--
function checkCR(evt) {
var evt = (evt) ? evt : ((event) ? event : null);
var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
if ((evt.keyCode == 13) && (node.type=="text")) {return false;}
}
document.onkeypress = checkCR;
//-->
</script>
</head>
<body>
<p><center><form action="" method="post">
Email Address<br><input type="text" name="field1" size="40" /><br>
Subject Matter<br><input type="text" name="field2" size="40" /><br>
Enter Your Comments<br><textarea cols="40" rows="5" name="field3" wrap="physical"></textarea><br>
<input type="submit" value="Send it!"><input type="reset" value="Clear it!">
</form></center></p>
</body>
</html>
When you put up a form page you should always tell your visitors to use the TAB key to move from one text field to the other. The more helpful you are, the more they will want to return to your site.
Would you like to play a trick on someone? There is an easy way to keep people from being able to type anything into the text fields of a form. Just add onclick="self.focus()" to the input tags and text area tags. Try typing text into the email form below. However, you will still be able to copy and paste text into it if you do so using the mouse not the keyboard. Enjoy! :)
Home Page This Page Was Last Updated: