请求全屏刷新对象标签中的数据(htmlcanvas)

Requesting full screen refreshes data (html canvas) in object tag

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

view.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 的游戏中途决定进入全屏,它会重新启动游戏(再次加载对象)。

我猜你是在 Chrome 或其他 Webkit/Blink 浏览器上遇到这个问题?

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

,他们卸载它的内容

这也是有意义的,因为元素实际上是从活动文档中分离出来的。

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

Ps:data="url,不是 src="..