Javascript 无法在“元素”上执行“requestFullScreen”：API 只能由用户手势启动
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/32642865/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Failed to execute 'requestFullScreen' on 'Element': API can only be initiated by a user gesture
提问by Tae Hagen
I want to make my HTML5 game go native fullscreen on launch. When I do this with a button onclick, it goes fullscreen. But when I use window.onload to make it go fullscreen onload, it replys on the console Failed to execute 'requestFullScreen' on 'Element': API can only be initiated by a user gesture. I am using chrome. Is there a workaround this?
我想让我的 HTML5 游戏在启动时成为原生全屏游戏。当我使用 onclick 按钮执行此操作时，它会全屏显示。但是当我使用 window.onload 使其全屏加载时，它在控制台上回复 Failed to execute 'requestFullScreen' on 'Element': API can only beinited by a user手势。我正在使用铬。有解决方法吗？
My code:
我的代码：
<!DOCTYPE html>
<html>
<head>
<script>
window.onload = openfullscreen();
function launchIntoFullscreen(element) {
if(element.requestFullscreen) {
element.requestFullscreen();
} else if(element.mozRequestFullScreen) {
element.mozRequestFullScreen();
} else if(element.webkitRequestFullscreen) {
element.webkitRequestFullscreen();
} else if(element.msRequestFullscreen) {
element.msRequestFullscreen();
}
}
function openfullscreen() {
launchIntoFullscreen(document.documentElement);
}
function exitFullscreen() {
if(document.exitFullscreen) {
document.exitFullscreen();
} else if(document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if(document.webkitExitFullscreen) {
document.webkitExitFullscreen();
}
window.close();
}
function fix() {
var screenwidth = screen.width;
var screenhei = screen.height;
document.getElementById('ifam').width = screenwidth;
document.getElementById('ifam').height = screenhei;
}
</script>
<style>
#ifam {
position:fixed;
left:0%;
top:0%;
z-index:-1;
}
#fullscreen {
position:fixed;
left:0%;
top:0%;
z-index:1;
}
</style>
</head>
<body onload="fix()">
<div id="fullscreen">
<button onclick="openfullscreen()">Open</button>
<button onclick="exitFullscreen()">Exit</button>
</div>
<iframe id="ifam" src="lchosser.html"></iframe>
</body>
</html>
回答by hunters30
Any javascript api is intentionally made this way I guess. Just imagine if you go to a website and it automatically turns on in fullscreen without you doing anything at all. You would be exposed to a whole world of annoying popups and other stuff you dint even intend to open. So any such script requires user interaction to work. Switching to fullsreen without user interaction quite very much feels like malicious intent. Example if a site such as this opened up in fullscreen : Virtual Desktopsomeone may pretty much be confused of what just happened to their desktop.
我猜任何 javascript api 都是故意以这种方式制作的。试想一下，如果你访问一个网站，它会自动全屏打开，而你什么都不做。您将接触到令人讨厌的弹出窗口和您甚至打算打开的其他东西的整个世界。因此，任何此类脚本都需要用户交互才能工作。在没有用户交互的情况下切换到 fullsreen 感觉非常像恶意意图。例如，如果像这样的网站以全屏方式打开：虚拟桌面，有人可能会对他们的桌面刚刚发生的事情感到困惑。
If you still want to try a partial workaround maybe then take a look at following answer :
如果您仍然想尝试部分解决方法，请查看以下答案：
