通过给文本框<input enterKey=“fnName” />设置enterKey=“fnName”，页面加载完后会自动绑定input的keydown事件，捕捉到回车键则调用fnName函数，如select等其它form元素也可以。要实现form表单元素回车键统一事件响应，js需要做以下事情：
1）在页面window.onload事件统一绑定含有enterKey="fnName"属性的form表单元素的keydown事件；
2）在keydown事件中判断是否为回车键，如果是则调用fnName
1、html+js代码段
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Form表单元素回车键统一响应</title>
<script src="http://res.maben.com/ly-assets/assets/js/lib/jquery-1.11.1.min.js"></script>
<link rel="stylesheet" href="http://res.maben.com/ly-assets/assets/bootstrap/css/bootstrap.min.css">
</head>
<body>
<div class="container" style="margin-top: 30px;">
<div class="form-horizontal">
<div class="form-group">
<label class="col-xs-2">Input框：</label>
<div class="col-xs-4">
<input class="form-control" id="user_name" enterKey="doSubmit" placeholder="输入姓名"></input>
</div>
</div>
<div class="form-group">
<label class="col-xs-2">Select下拉框：</label>
<div class="col-xs-4">
<select class="form-control" id="user_title" enterKey="doSubmit()">
<option value="讲师">讲师</option>
<option value="副教授">副教授</option>
<option value="教授">教授</option>
</select>
</div>
</div>
<div class="form-group">
<div class="col-xs-2 col-sm-offset-2">
<button class="btn btn-primary" type="button" onclick="doSubmit()">提交</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
function doSubmit() {
alert("name: " + $("#user_name").val() + "\ntitle: " + $("#user_title").val());
}
$(window).on("load",function(){
$("[enterKey]").each(function(i, elem){
var funcName = $(elem).attr("enterKey");
if(! funcName) return false;
$(elem).bind("keydown", function(e){
if(e.keyCode == 13) {
eval(funcName.indexOf("(") >=0 ? funcName : funcName+"();");
}
});
});
});
</script>
</body>
</html>
2、截图
代码说明：
1）enterKey = “”, 可以是函数名，也可以是函数调用字符串，甚至可以带参数；
- enterKey=“doSubmit”
- enterKey=“doSubmit()”
- enterKey=“doSubmit(‘arg0’)”
2）$(window).on(“load”,function()…这段代码最好放到一个独立的js文件，所有页面引入该js文件即可实现enterKey，form表单元素回车统一响应处理。
3、代码优化
文中使用eval表达式解析字符串函数，存在影响代码作用域的风险，从而可能影响代码安全性，为此，需要用其它代码实现来替换eval表达式，改进后的代码如下：
$(window).on("load",function(){
$("[enterKey]").each(function(i, elem){
var funcName = $(elem).attr("enterKey");
if(! funcName) return false;
$(elem).bind("keydown", function(e){
if(e.keyCode == 13) {
// eval(funcName.indexOf("(") >=0 ? funcName : funcName+"();");
(new Function("return " + funcName.indexOf("(") >=0 ? funcName : funcName+"();"))();
}
});
});
});