Javascript 焦点是否会触发键控事件？

我制作了3个时间输入框（hh、mm、ss） 当用户在hh中键入2位数字时，它将自动聚焦下一个（mm）字段。mm和ss也一样

我正在使用“keyup”事件绑定输入框。然而，这种行为很奇怪：

如果我慢慢地输入两个数字，它就会工作。 如果我打字快一点，它会跳两次

我怀疑“焦点”事件触发了keyup事件，我不知道如何处理它。我试着在焦点事件上避免违约。但是没有运气

代码如下：

$('#hh').on('keyup', function (e) {
    var hh = $('#hh').val().toString();
    if (hh.length >= 2) {
        $('#mm').focus();
    }
});

$('#mm').on('keyup', function (e) {
    var mm = $('#mm').val().toString();
    if (mm.length >= 2) {
        $('#ss').focus();
    }
});

下面是一个演示：

（）

复制：在hh字段中快速键入2位数字，它将跳转到ss而不是mm

我在Chrome和Firefox上试过，同样的问题

看起来像是在第二次按键后发生的。，但我不确定为什么第二次“keyup”事件的目标是#mm

您可以尝试使用“输入”事件而不是“键控”事件。当输入值更改时触发此事件。出于这个目的，它更具语义，避免了键盘事件在错误时间触发的任何问题

$('#hh').on('input', function (e) {
  var hh = $('#hh').val().toString();
  if (hh.length >= 2) {
    $('#mm').focus();
  }
});

$('#mm').on('input', function (e) {
  var mm = $('#mm').val().toString();
  if (mm.length >= 2) {
    $('#ss').focus();
  }
});

---

我还没有检查哪些浏览器支持这个。它正在为我开发Chrome。

这很简单。如果您键入fast，事件将触发两次，因为您将“value”设置为2位数字。通过以下操作进行测试：按住两个键的同时键入“23”。然后释放2，它将跳转到第二个输入，然后释放3，它将跳转到最后一个输入

因此，一旦您在第一个输入中键入两位数字并释放一个键，事件将触发一次，在第二个键上，下一个事件键将立即触发，因为第二个输入的值已经是两位数字长

如果将其替换为占位符，则它可以工作。看看这个：

<input type="text" id="ss" class="chained" placeholder="30">

---

关于在你的帖子中添加代码，有一些规则。使用代码标记绕过它是不好的。stackoverflow还有Snipplet，它的功能与JSFIDLE基本相同。在Chrome上测试时，它似乎工作得很好。也许我遗漏了什么。@epascarello谢谢，我编辑了我的post@KJPrice我尝试了Chrome和FF，没有运气

var comesFromFirst = false;

$('#hh').on('keyup', function (e) {
    var hh = $('#hh').val().toString();
     comesFromFirst = true;
    if (hh.length >= 2) {
        $('#mm').focus();
    }
});

$('#mm').on('keyup', function (e) {
    var mm = $('#mm').val().toString();
    console.log(comesFromFirst);
    if (mm.length >= 2 && comesFromFirst == false) {    
        $('#ss').focus();
    }
    else{
        comesFromFirst = false;  
    }
});