最近在寫一個重大需求的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>
這樣，當你輸完一個文本框時，只要按下回車鍵，就能跳轉到下一個文本框，當跳轉到提交按鈕時，直接提交表單。是不是很簡單啊，快來實踐吧！