javascript - 无法从 Youtube IFrame 更改焦点

Question

我有一个Youtube iFrame我使用键盘快捷键控制播放。但是，当我快进/快退时，焦点会更改为 iFrame，它会捕获后续的按键操作。因此，我使用一个简单的函数来轮询焦点何时更改到 iFrame，然后将焦点切换回文档正文。这是实时代码:

CODEPEN

但是，这不起作用!即使 document.body.focus() 被调用，焦点也不会从 iFrame 发生变化。知道如何解决这个问题吗？

注意:我使用的浏览器是 Surface Pro 3 (Win 8.1) 上的 Chrome 41.0.2272.118

Answer 1

看起来像focus()仅适用于按钮(在 document.body 和常规 <p> 元素上测试，两者都不执行任何操作)。

Fixed CODEPEN (old, see update below!)

请注意，我添加了 document.getElementById("btn").focus()之前document.body.focus() ，但焦点切换到 btn而不是document.body 。我在 Surface Pro 3 (Win 8.1) 上使用的浏览器是 Chrome 41.0.2272.118

更新

事实证明，如果使用 display:none 隐藏按钮或visibility:hidden ，focus()方法已经不行了!这让我怀疑问题实际上在于元素是否可聚焦。显然是tabindex的-1使元素可聚焦，因此我通过设置 document.body.tabIndex = -1; 进行了测试在调用document.body.focus()之前。你瞧，它起作用了!

updated CODEPEN