爲了方便客戶操作我設計的軟件,引入鍵盤事件。尤其在比較多的輸入項的時候,一會兒用鍵盤一會而用鼠標會降低客戶的體驗。具體代碼如下:
<%@ page language="java" import="java.util.*" errorPage="/error.jsp" pageEncoding="utf-8" isELIgnored="false"%>
<%
String path = request.getContextPath();
%>
<!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>
<!-- 使用到Jquery,請自行下載安裝 -->
<script type="text/javascript" src="<%=path %>/easyui/jquery-1.8.0.min.js"></script>
</head>
<body>
<input class="1" type="checkbox" ><!-- Class按照順序排列從1開始,依次遞增 -->
<input class="2" type="text" >
<input class="3" type="text" >
<input class="4" type="text" >
<select class="5">
<option value="Mr">Mr</option>
<option value="Ms">Ms</option>
<option value="Mrs">Mrs</option>
<option value="Mstr">Mstr</option>
</select>
<input class="6" type="button" value="按鈕" >
<script language="javascript">
$(document).keydown(function (event) {
var sequence=event.srcElement.className;
sequence=parseInt(sequence);//序列默認是String類型轉換爲int類型
var n;
if (event.keyCode == 39) {/* event.keyCode==39判斷鍵盤是按下了左方向鍵 */
sequence=sequence+1;/* 向左序列減一 */
n='.'+sequence;/* 拼湊出Jquery的class,例如 '.1' */
$(n).focus();/* 將光標移動到相加後對應的class的位置 */
return false;
}
if (event.keyCode == 37) {/* event.keyCode==37判斷鍵盤是按下了右方向鍵 */
sequence=sequence-1;/* 向右序列加一 */
n='.'+sequence;
$(n).focus();/* 將光標移動到相加後對應的class的位置 */
return false;
}
});
</script>
</body>
</html>