javascript - 按下 Enter 键时如何触发 Tab 按键？

Question

这就是我所拥有的，并且运行良好。但我想返回 tab 键而不是什么都没有发生。

$(document).on("keypress", ":input:not(textarea):not([type=submit])", function(event) {
    if (event.keyCode == 13) {
        event.preventDefault();
    }
});

我想要的是:

if (event.keyCode == 13) {
    event.preventDefault();
    return event.keyCode = 9; <<= or something similar and simple
}

这似乎是重复的，但我没有看到任何东西可以代替 enter 代替 tab 代码...Tab 键已经知道跳过隐藏并使用 tab 指令。

Answer 1

我怀疑您真正想要的是移动到表单中的下一个字段。

如果是这样，您可以轻松找到下一个表单域并使用 .focus() 将其聚焦。例如:

var fields = $(this).closest("form").find("input, textarea");
var index = fields.index(this) + 1;
fields.eq(
  fields.length <= index
  ? 0
  : index
).focus();

例子:

$(document).on("keypress", ":input:not(textarea):not([type=submit])", function(event) {
  if (event.keyCode == 13) {
    event.preventDefault();
    var fields = $(this).closest("form").find("input, textarea");
    var index = fields.index(this) + 1;
    fields.eq(
      fields.length <= index
      ? 0
      : index
    ).focus();
  }
});

<form>
  <div>
    <label>
      Field 1:
      <input type="text">
    </label>
  </div>
  <div>
    <label>
      Field 2:
      <input type="text">
    </label>
  </div>
  <div>
    <label>
      Field 3:
      <input type="text">
    </label>
  </div>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

如果您使用 tabindex 以不同于文档顺序的顺序放置字段，您将需要做更多的工作，基本上是对 find 的结果进行排序> 在 tabindex 上并从那里开始工作。但这应该能让您走上正确的道路。