键盘事件控制光标向左向右

为了方便客户操作我设计的软件,引入键盘事件。尤其在比较多的输入项的时候,一会儿用键盘一会而用鼠标会降低客户的体验。具体代码如下:

 

<%@ 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>


 

你可能感兴趣的:(jquery,设计)