插曲：
自己负责的西城环保项目的登录页面，之前全部用鼠标和键盘操作，甚是不方便。
前天改为输入完username、password后，按回车键验证用户登录。期间可以和键盘的TAB键配合使用，效果更好。
今天经理又要全部使用Enter操作整个流程，我发现就Baidu的登录有使用外，Google、Yahoo、Sina都没有使用，
毕竟那样不合习惯。但经理一发话，我一个基层员工就得照做呀，除非我自己是老板，O(∩_∩)O~
摘要：
我现在以常见的WEB登录页面为案例，讲解Enter键如何支持TAB键转换及提交数据。
假设登录页面为login.htm，里面有<body>、<form>、<input type="*">等控件。
现在需求是登录页面username自动获取焦点，然后按Enter焦点自动移到password里，
最后按Enter提交验证用户数据登录。
正文代码：
<!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="X-UA-Compatible" content="IE=EmulateIE8" />
<title>系统登录</title>
<link href="css/login.css" rel="stylesheet" type="text/css" />
<script src="JS/DialogJS/ymPrompt.js" type="text/javascript"></script>
<link rel="stylesheet" id='skin' type="text/css" href="JS/DialogJS/skin/qq/ymPrompt.css" />
<script src="JS/jquery-1.3.2.js" type="text/javascript"></script>
<script type="text/javascript" language="javascript">
<!--
var jq = jQuery.noConflict();
jq(function() {
jq('#btnCancel').click(function() {
jq("#myName").val("");
jq("#myPsd").val("");
});
jq('#btnLogin').click(function() {
var name = jq('#myName').val();
var psd = jq('#myPsd').val();
if (name == '')
ymPrompt.alert('用户名不能为空！', null, null, '提示信息', null);
else {
//登录信息
jq.ajax({
type: "GET",
data: { UserName: name, UserPsd: psd },
url: "tree.aspx?mode=LoginOn",
dataType: "json",
cache: false,
success: function(data) {
if (data.Success == "true") {
location = "Default.aspx";
}
else
ymPrompt.errorInfo('您输入的用户名或密码有误！', null, null, '错误信息', null);
}
});
}
ymPrompt.close();
});
})
function GetEnterFocus() {
document.getElementById("myName").focus();
document.getElementById("myName").select();
document.getElementById("myName").onkeyup = GetNextInput;
document.getElementById("myPsd").onkeyup = GetNextInput;
}
function GetNextInput() {
if (event.keyCode == 13) {
if (event.srcElement == document.getElementById("myName")) {
document.getElementById("myPsd").focus();
document.getElementById("myPsd").select();
}
if (event.srcElement == document.getElementById("myPsd")) {
event.returnValue = false;
event.cancel = true;
document.getElementById("btnLogin").click();
return false;
}
}
}
//Enter提交账号密码
// function document.onkeydown() {
// if (event.keyCode == 13) {
// event.returnValue = false;
// event.cancel = true;
// document.getElementById("btnLogin").click();
// return false;
// }
// }
-->
</script>
</head>
<body onload="javascript:GetEnterFocus();">
<!--action="Login.htm" method="post"-->
<form id="form1">
<table width="100%" height="254" border="0" cellspacing="0">
<tr>
<td height="21">
<input type="text" id="myName" class="dengluming" />
</td>
</tr>
<tr>
<td height="21">
<input type="password" id="myPsd" class="dengluming" />
</td>
</tr>
<tr>
<td height="49">
<table border="0" cellspacing="0" style="margin-left: 235px">
<tr>
<td>
<a href="#" id="btnLogin" class="login_btn">登 录</a>
</td>
<td>
<a href="#" id="btnCancel" class="login_btn">取 消</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>
</body>
</html>
【感谢goodsong（风卷残云~不要把简单的事搞得N复杂 提供思路】
