谷歌浏览器复制了 JavaScript 的“焦点”事件答案

【问题标题】：Google Chrome duplicates JavaScript 'focus' event谷歌浏览器复制了 JavaScript 的“焦点”事件
【发布时间】：2012-03-13 08:25:53
【问题描述】：

我注意到 Chrome 如何处理 javascript 焦点事件的一个奇怪问题。事实上，它会持续触发焦点事件，即使它只发生一次。我在这里做了一些研究，发现人们在使用 alert() 时会遇到同样的问题。当他们关闭警报窗口时，焦点会返回到他们的输入，并且处理程序会一次又一次地触发。就我而言，问题是不同的，因为我使用的是 console.log()，并且有时我会得到相同的日志 2 次甚至 3 次。我注意到它通常发生在我清除控制台然后专注于一个元素时。当我尝试重复它时，它不再发生。

场景：

清除控制台
关注元素（2 或 3 条控制台消息）
关注其他相同的元素或取消焦点并再次关注一样的（没问题）
清除控制台
关注元素（2 或 3 条控制台消息 - 问题又回来了！）

我创建了一个 jsfiddle，请查看： http://jsfiddle.net/ffuWT/3/

问题是，这个问题的原因是什么，我该如何解决？

【问题讨论】：

运行 Chrome 17.0.963.78 m 对我来说按预期工作（不是你描述的方式）
我无法重现您的问题，而且我看不出在#4 中清除控制台会导致事件触发两次的问题？您是否尝试过阻止事件在您的函数中冒泡？尝试添加e.stopPropagation()
我能够重现问题。 e.stopPropagation 没有为我解决。
实际上，我无法重现问题。我能够创建一个类似的问题：专注于一个元素。然后 alt-tab 到另一个窗口（触发 4 个或更多焦点事件）然后 alt-tab 返回（触发 2 个或更多焦点事件）
@RoryMcCrossan 是的，我试过了 - 没有运气。

标签： javascript jquery google-chrome focus

【解决方案1】：

这些事情怎么会发生令人毛骨悚然。我今天在工作中遇到了这个确切的问题，但很快就把它写掉了，怀疑在第 3 方插件（jQuery customInput）中侦听和传播可疑的事件。明天我会仔细检查你的 jsfiddle。

我无法在我的当前可用 设置（Mac 上的 Chrome v17）上重新创建您的确切输出，但我确实有一个理论要分享。在您的场景和 Ben Lee 的评论中，一致的部分是将焦点转移到另一个窗口（在您的情况下为控制台）。

查看“窗口+可聚焦元素”下的http://www.quirksmode.org/dom/events/blurfocus.html：

如果在可聚焦元素获得焦点时窗口向后发送，模糊事件应该同时触发。如果窗口前移同样，焦点事件应该同时触发。

接下来，在兼容性表中指出

Safari Windows 触发两个焦点事件。

也许 Chrome 终于也有了这个“功能”，来自 Webkit 家族等等？

【讨论】：

谢谢，您的回答是正确的，链接也很有用。我决定选择 Stefan 的答案，因为他给了我关于这个问题的原因的准确和正确的信息（或者只是不同的行为，如果你愿意的话），而你只发布了你的理论。这是真的，实际上，所以 +1，无论如何。
@noname: 让我无需再次检查 :)

【解决方案2】：

我能够重新创建问题（使用您的 jsFiddle），据我所知，仅当您单击 select 而没有关注结果框架/在结果框架中时才会发生此问题。

在您单击以展开 selects 之一之前，在框架内单击而不是在 selects 上单击，您只会看到记录的一行。

您还可以将/show 附加到jsFiddle URL 以查看result in a separate window。

似乎通过单击select 控件来聚焦窗口会多次触发事件。

Open this demo 并取消聚焦浏览器窗口（通过单击桌面、任务栏或其他窗口），然后单击其中一个selects 以展开其options 并查看控制台。

使用 Chrome 17.0.963.79 m.

【讨论】：