使用 jQuery 在按下 Enter 键时选择下一个字段

Question

我有一个HTML表单，每当按下Enter键时，下一个字段就会被选中。
以下是代码：

 $(document).on("keydown","input",function(event) {
     if (event.which === 13) {
      event.stopPropagation();
      event.preventDefault();
      $(this).nextAll("input").eq(0).focus();
     }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
     <table>
      <tr>
       <td>Medical Record No.</td><td><input type="text" name="labNo" /></td>
      </tr>
      <tr>
       <td>Age/sex </td><td><input type="text" name="age" />
        <select id="age">
         <option value="Year">Year</option>
         <option value="Month">Month</option>
        </select>
        <select id="sex">
         <option value="Male">Male</option>
         <option value="Female">Female</option>
        </select>
       </td>
      </tr>
      <tr>
       <td>Phone </td>
       <td><input type="text" name="" value="-,-" /></td>
      </tr>
      <tr>
       <td colspan="2"><input type="button" id="patBtn" value="Save (S)" accesskey="s" />
        <input type="reset" value="Set Default (D)" accesskey="d" />
       </td>
      </tr>
     </table> 
    </form>

这不起作用。

- Axeem

Answer 1

尝试以下脚本。

$(document).on("keydown","input",function(event) {
    debugger;
    if (event.which === 13) {
        event.stopPropagation();
        event.preventDefault();
        $(this).parents("tr").next().find("input").focus();
    }
});

演示

- user3497034

Answer 2

这应该可以在任何HTML结构下工作

$(document).on("keydown","input",function(event) {
if (event.which === 13 || event.keyCode === 13) {
    event.stopPropagation();
    event.preventDefault();
    var position = $(this).index('input');
    $("input").eq(position+1).focus();
}
 });

同样适用于选择：

$(document).on("keydown, keyup","input, select",function(event) {
if (event.which === 13 || event.keyCode == 13) {
    event.stopPropagation();
    event.preventDefault();
    var position = $(this).index('input, select');
    $("input, select").eq(position+1).focus();
}
 });

jsfiddle: http://jsfiddle.net/xh0m7pzu/1/

jsfiddle：http://jsfiddle.net/xh0m7pzu/1/

- A_funs

---

如何在“select”选项中进行操作？@A_funs - Axeem

实际上我进行了更改，添加了keyup，现在似乎在所有浏览器中都可以工作了。 - A_funs

你试过 JSFiddle 吗？用的是什么浏览器？你需要同时使用 keyup 和 keydown，就像上面的代码一样。 - A_funs

在Chrome、Safari和Firefox中对我来说完美运行。 - A_funs

不在这里，Chrome 版本 Version 38.0.2125.111 m。 - Axeem

38.0.2125.111在这里，不确定m是什么意思。 - A_funs