我如何在页面加载时加载全屏模式

Question

实际上我希望每当我打开 .html 页面时，页面都应该以全屏模式自动加载。 当我点击你好但我希望它在页面上加载时它有效，这是我尝试使用的代码，

<a href="#" type="button" id="modal" onclick="launchFullscreen(document.documentElement);" >hello</a>


<script>
function launchFullscreen(element) {
    if(element.requestFullscreen) {
    element.requestFullscreen();
  } else if(element.mozRequestFullScreen) {
    element.mozRequestFullScreen();
  } else if(element.webkitRequestFullscreen) {
    element.webkitRequestFullscreen();
  } else if(element.msRequestFullscreen) {
    element.msRequestFullscreen();
  }
}
</script>
<script type="text/javascript">
launchFullscreen(document.documentElement);
</script>

Answer 1

出于安全原因，现代浏览器不允许自动全屏。
首先必须有来自用户的交互。 就像点击“你好”按钮一样。

Answer 2

由于安全问题，javascript 无法在页面加载时加载全屏。即使您尝试在超链接上触发点击事件，它也会向您显示以下警告。

无法在“元素”上执行“requestFullScreen”：API 只能由用户手势启动。

Answer 3

这是带有自动单击按钮 onload 的好方法...它在代码段中被阻止，因此直接插入您的代码/网站。

 window.onload = function(){ document.getElementById('btn').click(); var scriptTag = document.createElement("script"); scriptTag.src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"; document.getElementsByTagName("head")[0].appendChild(scriptTag); } function toggleFullScreen(elem) { // ## The below if statement seems to work better ## if ((document.fullScreenElement && document.fullScreenElement !== null) || (document.msfullscreenElement && document.msfullscreenElement !== null) || (!document.mozFullScreen && !document.webkitIsFullScreen)) { if ((document.fullScreenElement !== undefined && document.fullScreenElement === null) || (document.msFullscreenElement !== undefined && document.msFullscreenElement === null) || (document.mozFullScreen !== undefined && !document.mozFullScreen) || (document.webkitIsFullScreen !== undefined && !document.webkitIsFullScreen)) { if (elem.requestFullScreen) { elem.requestFullScreen(); } else if (elem.mozRequestFullScreen) { elem.mozRequestFullScreen(); } else if (elem.webkitRequestFullScreen) { elem.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT); } else if (elem.msRequestFullscreen) { elem.msRequestFullscreen(); } } else { if (document.cancelFullScreen) { document.cancelFullScreen(); } else if (document.mozCancelFullScreen) { document.mozCancelFullScreen(); } else if (document.webkitCancelFullScreen) { document.webkitCancelFullScreen(); } else if (document.msExitFullscreen) { document.msExitFullscreen(); } } }

 <input id="btn" class="btn" style="float:left; opacity: 0;" type="button" value="Full screen mode" onclick="toggleFullScreen(document.body)">