向上和向下箭头导航在iframe内部被阻止

Question

我正在尝试为仅限键盘的用户改善我的网站的可访问性。我被箭头上下导航阻止在页面上滚动。通常它可以工作，但如果我在iframe中播放视频，它就会停止工作（因为在iframe中滚动是有限的）。是否有javascript（或jquery或html）解决方案？

Answer 1

非常棒的是，为了便于访问，您尝试为仅限键盘的用户提供更好的功能，但目前正在使用的方式是正确的。当iframe获得焦点（或iframe中的任何元素）时，所有事件都会转到iframe。如果iframe显示的内容多于iframe中的内容，则向上/向下箭头将滚动iframe的内容，而不是主页面的内容。如果您在焦点位于iframe时强制向上/向下滚动主页，则会导致意外行为。

现在，最终用户可能不知道或不关心您使用iframe，只是看到您网页上的视频，并且可能想知道为什么他们不能再使用向上/向下箭头滚动页面键。这是如何实施iframe的一个不幸后果。

您可能尝试的一件事是在iframe上添加键盘事件处理程序，当您获得向上/向下箭头键时，将其冒泡到包含文档。也许是这样的（未经测试）：

document.getElementById("myiframe").contentDocument.addEventListener(...)

你有

的地方

<iframe id="myiframe">