javascript - 填写 4 个字符时自动切换到下一个输入字段

Question

我想做的是，在填写四个字符时指向下一个选项卡。每个字段应有 4 个字符，完成后应移至下一个输入框。

 $(".inputs").keyup(function () {
        if (this.value.length == this.maxLength) {
          $(this).next('.inputs').focus();
        }
  });

Fiddle .

Answer 1

您的代码工作正常，但是您的输入元素设置为 type="number"。非数字内容将被忽略，因此如果您输入“abcd”，例如，输入的 value 为空(意味着 length 为 0 ).另一方面，如果您输入“1234”，则输入的值为 1234。

如果您希望在输入非数字内容时触发您的代码，只需将每个输入的类型更改为文本即可。

<input class="inputs" type="text" maxlength="4" />

JSFiddle demo .

请注意，我还从该示例中的每个元素中删除了重复的 class 属性。

---

作为krish has mentioned in the comments关于您的问题，您的代码存在问题，因为最后一个 input 元素将继续接受超过 4 个字符。要解决此问题，请进行检查以确保存在 next('.inputs') 元素:

if (this.value.length == this.maxLength) {
  var $next = $(this).next('.inputs');
  if ($next.length)
      $(this).next('.inputs').focus();
  else
      $(this).blur();
}

JSFiddle demo .