一般按enter键，提交表单。此代码主要实现按enter键不提交表单，而是触发另外的事件。
CSS样式：
* {
margin:0;
padding:0;
font-size:12px;
}
#main {
960px;
height:600px;
background:lightblue;
margin:0 auto;
padding-top:30px;
padding-left:30px;
}
#content {
background:#fff;
500px;
height:500px;
padding:30px 0 0 30px;
}
#content form p {
height:30px;
margin-top:20px;
}
#content form p span {
color:red;
padding:3px;
}
#content form p strong {
display:inline-block;
font-size:16px;
text-align:right;
font-weight:100;
100px;
line-height:150%;
}
input.inp {
240px;
height:35px;
font-size:20px;
border:1px solid #eee;
}
input.sub {
100px;
height:30px;
border:none;
margin-left:37px;
margin-top:10px;
cursor:pointer;
background:#666;
font-size:16px;
font-weight:bold;
color:#fff;
}
input#but {
100px;
height:30px;
border:none;
margin-left:105px;
margin-top:10px;
cursor:pointer;
background:#666;
font-size:16px;
font-weight:bold;
color:#fff;
}
HTML和JS代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>表单验证JS效果</title>
<script type="text/javascript">
function check(){
var val=document.myform.email.value; //取得输入的邮箱值
if(val==""){ //输入邮箱为空
alert("请输入邮箱！");
return false;
}
else { //邮箱中有内容，进行正则匹配
var emailpreg="^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$"; //正则匹配表达式
var preg=new RegExp(emailpreg);
if(val.match(preg)==null){ //匹配不成功
alert(val+"\n"+"输入的邮箱格式不正确！");
return false;
}
}
var pwdval=document.myform.pwd.value; //取得密码输入框中的值
if(pwdval==""){ //密码框中为空
alert("输入密码");
return false;
}
if(pwdval.length>20){ //密码框中内容太长
alert("密码长度太长，密码长度必须少于20");
return false;
}
var nameval=document.myform.uname.value; //取得昵称框中的值
if(nameval==""){ //昵称框中为空
alert("输入昵称");
return false;
}
if(nameval.length>10){ //昵称框中内容太长
alert("昵称长度太长，昵称长度必须少于10");
return false;
}
}
if(document.attachEvent){
document.attachEvent("onkeydown",function(e){
if(e.keyCode == 13)
alert("a");
});
}
else {
document.addEventListener("keydown",function(e){
if(e.keyCode == 13)
document.getElementById("but").click();
});
}
</script>
</head>
<body>
<div id="main">
<div id="content">
<form name="myform" action="" method="post" onkeydown="if(event.keyCode==13){return false;}">
<p><strong><span>*</span>我的邮箱</strong>
<input class="inp" type="text" name="email" />
</p>
<p><strong><span>*</span>创建密码</strong>
<input class="inp" type="password" name="pwd"/>
</p>
<p><strong><span>*</span>昵称</strong>
<input class="inp" type="text" name="uname" />
</p>
<p>
<input type="button" id="but" value="not agree" onclick="location.href='http://www.baidu.com'"/>
<input class="sub" type="submit" value="sub" onclick="check();"/>
</p>
</form>
</div>
</div>
</body>
</html>
代码解析：
first：
<form name="myform" action="" method="post" onkeydown="if(event.keyCode==13){return false;}">
上面红色标记的代码是实现按enter键不提交表单。
second:
if(document.attachEvent){
document.attachEvent("onkeydown",function(e){
if(e.keyCode == 13)
alert("a");
});
}
else {
document.addEventListener("keydown",function(e){
if(e.keyCode == 13)
document.getElementById("but").click();
});
}
上面标记的代码是实现按enter键触发其他事件，也就是跳转。