首页 > 解决方案 > 谷歌浏览器在警报被解除之前执行 HTMLElement.focus

问题描述

发现与 Firefox 和 Edge 相比,Google Chrome 产生不同的行为,代码如下:

function lossFocus(e) {
  alert('blur'); // prompt alert
  e.focus();     // focus back to textbox
}
<input type="text" onblur="lossFocus(this);" />
<!-- NOTE: You may need to refresh this page after trigger onblur in Chrome to avoid popup loop -->

这导致lossFocus在谷歌浏览器中无限触发广告,就像focus在用户通过按 OK 或使用 Enter 键关闭弹出对话框之前执行的那样,但其他浏览器并非如此。(Edge 之后设法将输入字段的注意力集中在后面alert)是什么原因,这是预期的行为吗?

window.confirm()window.alert()似乎有希望在捕获用户输入后执行代码,这是否意味着如果我们希望仅在从弹出对话框获得用户反馈后执行代码,我们应该远离?

标签: javascriptgoogle-chromedomdom-events

解决方案


目前还没有任何见解,但发现其中一种解决方法是将罪魁祸首用 nil 超时包裹起来,如下所示:

function lossFocus(e) {
  alert('blur');
  setTimeout(() => { e.focus(); }, 0); // focus properly now after dismiss popup
}
<input type="text" onblur="lossFocus(this);" />


推荐阅读