Html表单中回车键跳转文本框

最近在写一个重大需求的Mis系统，需要大量录入一些需求征集，里面有很多文本框input,所以在录入时，需要点击鼠标或者按tab键跳转到下一个文本框，比较麻烦，所以就想用回车键来代替，当按下回车键时，自动跳入下一个文本框，这样就会节约大量的时间和工作量，录入也比较简单。

遇到的问题：

由于文本框都是在form表单中，当表单中有提价按钮时，按下回车键，浏览器会默认提交表单，但是我们只是想让他跳到下一个文本框，那么就想到关闭form表单回车键提交表单的事件，但是这样又会将回车键跳转文本框的功能也关闭，那么如何实现这一功能呢？

于是就想到用回车键来代替tab键，这样就很方便了。下面来看代码。

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>

<script type="text/javascript">
    function handleEnter(field, event) {
        var keyCode = event.keyCode ? event.keyCode : event.which ? event.which
                : event.charCode;
        if (keyCode == 13) {
            var i;
            for (i = 0; i < field.form.elements.length; i++)
                if (field == field.form.elements[i])
                    break;
            i = (i + 1) % field.form.elements.length;
            field.form.elements[i].focus();
            return false;
        } else
            return true;
    }
</script>
</head>
<body>
<form action="1.html" method="post">
1.<input type="text" onkeypress="return handleEnter(this, event)">
2.<input type="text" onkeypress="return handleEnter(this, event)">
3.<input type="text" onkeypress="return handleEnter(this, event)">
4.<input type="text" onkeypress="return handleEnter(this, event)">
5.<input type="text" onkeypress="return handleEnter(this, event)">
6.<input type="text" onkeypress="return handleEnter(this, event)">
<input type="submit" value="提交" >
</form>
</body>
</html>

这样，当你输完一个文本框时，只要按下回车键，就能跳转到下一个文本框，当跳转到提交按钮时，直接提交表单。是不是很简单啊，快来实践吧！