javascript - 使用JS全屏显示页面

Question

我想在打开时全屏显示我的页面(无需用户输入)。我怎样才能做到这一点？我试过这段代码，但它实际上不起作用

function fullScreen(element) {
    if (element.requestFullscreen) {
        element.requestFullscreen();
    } else if (element.webkitrequestFullscreen) {
        element.webkitRequestFullscreen();
    } else if (element.mozRequestFullscreen) {
        element.mozRequestFullscreen();
    }
}

var html = document.documentElement;
fullScreen(html);

Answer 1

今天 (6/2018) 如果没有用户交互触发的事件，则无法调用全屏方法。正如医生所说:

Fullscreen requests need to be called from within an event handler or otherwise they will be denied.

https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API我们无法模仿这种互动。此示例显示了该行为:

<div id="somediv">
    content
</div>

<script>

var div = document.getElementById("somediv");

function toggleFullScreen() {
    if (!document.mozFullScreen && !document.webkitFullScreen) {
      if (div.mozRequestFullScreen) {   
        div.mozRequestFullScreen();
      } else {
        div.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
      }
    } else {
      if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen();
      } else {
        document.webkitCancelFullScreen();
      }
    }
  }

  document.addEventListener("click", function(e) {
      console.log("click");
      toggleFullScreen();
  }, false);


div.click();

</script>

这个例子表明console.log("click");在没有交互的情况下执行，但全屏被拒绝。如果用户执行点击(用户事件)，则允许全屏。