javascript - 在对象标签中请求全屏刷新数据（html 画布）

Question

我在查看页面上有一个按钮，可以使带有 id 游戏的对象标签全屏显示。

视图.html

<object id="game" src="url/file.html"></object>
<span onclick="fullScreen()"></span>

main.js

function fullScreen() {
var elem = document.getElementById("game");
if (elem.requestFullscreen) {
    elem.requestFullscreen();
    document.addEventListener('fullscreenchange', fullScreenExit, false);
} else if (elem.msRequestFullscreen) {
    elem.msRequestFullscreen();
    document.addEventListener('fullscreenchange', fullScreenExit, false);
} else if (elem.mozRequestFullScreen) {
    elem.mozRequestFullScreen();
    document.addEventListener('mozfullscreenchange', fullScreenExit, false);
} else if (elem.webkitRequestFullscreen) {
    elem.webkitRequestFullscreen();
    document.addEventListener('webkitfullscreenchange', fullScreenExit, false);
}
}

问题

单击该按钮时fullscreen，它可以正常工作并使游戏全屏显示，但会刷新它。因此，如果用户在关卡 2 的游戏中途并决定进入全屏模式，它会重新启动游戏（再次加载对象）。

Answer 1

我猜你在 Chrome 或其他 Webkit/Blink 浏览器上遇到过这种情况？

他们有一个奇怪的行为 <object>，当元素不再在文档中时（或者甚至只是style=display:none;...

这也是有道理的，因为该元素实际上是从活动文档中分离出来的。

我猜你能做的不多，虽然你可能想提交一个错误报告，但我强烈建议你尝试一个<iframe>替代方案，它不会受到这个几年前的错误的影响......

_{ps：是data="url给<object>的，不是src="..}