阻止 SPACE 和 ARROW 滚动 [游戏 Iframe]

Question

当游戏专注于儿童在线游戏网站时，我无法阻止 Space 和箭头滚动 down/up。

要在网页上阻止此功能，我知道，我们可以使用：

window.addEventListener("keydown", function(e) {
        if(["Space","ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].indexOf(e.code) > -1) {
            e.preventDefault();
        }
    }, false);

但是，问题出在游戏聚焦的时候。

游戏是通过 iframe 镜像的，一旦用户点击游戏并且游戏 iframe 获得焦点，上面的 code 将不再起作用。

当然，这很令人沮丧，因为在我们的游戏中，您需要使用 Space 或 Up/Down 箭头来移动、跳跃或执行其他操作 - 但只要您按下这些按钮，页面将开始滚动。

页面示例：

...
<body>
<iframe src="https://example.com/game/game21/index.html" width="X" height="Y"></iframe>
...

我没有修改src页面的权限。

Answer 1

你不见了e.stopPropagation();。试试这个：

window.addEventListener("keydown", function(e) {
    if(["Space","ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].indexOf(e.code) > -1) {
        e.preventDefault();
        e.stopPropagation();
    }
});

阻止 SPACE 和 ARROW 滚动 [游戏 Iframe]

Prevent SPACE and ARROW from scrolling [Game Iframe]

html

javascript

scroll

keydown

preventdefault