Javascript 单击链接时聚焦输入中的Keyup事件

我有一个按钮，当它点击时，我会显示一些输入字段。 输入字段跟踪键控事件本身

当我用键盘点击按钮时（聚焦然后点击回车键），输入字段会收到一个意外的按键事件

演示：（只需点击return并查看页面上的消息）

但是如果我添加一个超时，一切都会按预期进行。演示：（点击按钮返回时无按键事件）

为什么会发生这种奇怪的事情？我怎样才能修好它

带有处理程序的代码

$button.on("click", function(){
    showModal();
});

$emailField.on("keyup", function(event) {
    // process the event
});

var showModal = function() {
    $modal.show();
    $emailField.focus();
}

尝试

$button.on（“键控鼠标”，function（）{

或

$emailField.on（“按键”，函数（事件）{

尝试

$(document).ready(function(){
    $(document).on("click",".btn",function(e){
       $status.append($("<span>btn click</span></br>"));
    });
    $(document).on("keyup",".email",function(e){
        $status.append($("<span>keyup " + event.keyCode + "</span></br>"));
    });
  });

$（文档）.ready（函数（）{
$（文档）。在（“单击”上，“.btn”，函数（e）{
$status.append（$（$btn点击“
”）；
});
$（文件）.on（“键控”和“.email”，功能（e）{
$status.append（$（“keyup”+event.keyCode+”
）；
});
});

是的，之所以会发生这种情况，是因为你点击键盘时，点击事件先触发，然后根据你的逻辑，你的输入字段会聚焦，你的按键事件会触发。但是当你给出超时时，所以点击事件先触发，但由于超时，你的逻辑会延迟，并且你的按键事件完成了我们的工作，所以焦点不会在在您的输入中，它为什么不在您的输入中输入任何单词。

没有超时的可能解决方案：

$button.on（“按键”），功能（事件）{
如果（event.keyCode==13）{
返回false；
}
});
$button.on（“按键”，功能（事件）{
如果（event.keyCode==13）{
showModal（）；
$status.append（$（$已按enter键）
）；
}
});

之所以会发生这种情况，是因为在单击事件之后触发keyup事件，而此时焦点已经在输入中。当使用超时时，会延迟执行插入输入的函数，因此当keyup触发时，它没有焦点。@adeneo为什么会触发keyup事件？看看这个小提琴：当我按下按钮n上的return时o btn.keyup事件被激发。再次，keyup事件在点击后激发，因此焦点已经切换到输入，那么为什么要在按钮上激发keyup事件？@adeneo哦，我明白了，谢谢。顺便说一句，那把小提琴是错误的。正确的：（如果注释掉

modal.show

keyup事件将被激发）@adeneo如果你点击空格键，那么按键将在点击前触发。你知道为什么吗？我不想使用keypres事件，因为它与按键不一样，也不是很正式：为什么会触发按键事件？看看这个提琴：当我点击返回按钮时，没有触发btn.keyup事件。请运行提琴，然后按enter键

$button.on("keypress", function(event){
  if (event.keyCode == 13) {
    return false;
  }
});

$button.on("keyup", function(event){
  if (event.keyCode == 13) {
    showModal();
    $status.append($("<span>enter has been pressed</span></br>"));
  }
});