Question

我对这件事感到非常难过。这是我正在尝试做的事情：我有一个div元素（称之为#keys），我正用它来处理按键事件。

HTML：

<div id="#keys" tabindex="1">Focus</div>

JS：

$('#keys').keydown(function () {
    $('#log').append('*'); // just note that an event happened
});

这可以按预期工作 - 只要#keys重点关注，我就可以接收按键事件并对其进行响应。此外，我可以将焦点设置为其他div元素，#keys将不再处理按键事件。然后，我可以重新聚焦div（例如，通过直接单击它，或通过响应另一个DOM元素上的click事件），按照我的预期处理按键事件。

到目前为止，这么好。我遇到的问题是，如果我关注一个输入元素，然后尝试通过设置一个#keys处理程序来重新聚焦blur，该处理程序在从输入中跳出后被激活，{{1 div没有得到焦点！如果我通过点击模糊远离输入，它可以正常工作，但如果我使用键盘则不行。

#keys

我认为这个问题的实质是，为什么我的$('#input').blur(function () { $('#log').append('blur'); // note that a blur happened $('#keys').focus(); }); blur处理程序在输入标签时似乎无法正常工作（但是点击时它可以正常工作）？这只是一个浏览器的怪癖吗？（我在Mac OS上使用Chrome 30.0.1599.101。）

这是我关于JS的第一个问题，所以请让我知道我可以提供哪些更详细的描述情况。

（编辑：有趣的是，如果我将标签从#input移开，似乎工作正常。仍然混淆了这里发生的事情;似乎是某种与tabindex相关的问题？）

Answer 1

我还没有评论权限，所以我必须回答，但请mods改变这个，因为它基本上是重复的。

这是你小提琴的修复： http://jsfiddle.net/NsRyr/3/

问题（如this answer中所述）是模糊事件在更改完成之前触发，因此焦点需要在堆栈之后发送。添加计时器可以解决问题。

我改变的路线是：

setTimeout($('#keys').focus.bind($('#keys')), 0);

这样就可以等到新焦点事件完成后再触发处理程序。

输入模糊后无法获得焦点返回div

1 个答案: