更改页面或刷新时失去全屏

Question

在我的网络应用程序中，我有一个按钮允许用户在全屏模式下工作。我的问题是它只适用于当前页面，如果我们单击 link 或以任何其他方式更改页面，或者即使我们刷新当前页面，全屏模式也会丢失。

这是我用来允许全屏的功能：

// Handle full screen mode toggle
var handleFullScreenMode = function () {
  // toggle full screen
  function toggleFullScreen() {
    if (!document.fullscreenElement && !document.mozFullScreenElement && !document.webkitFullscreenElement) {  // current working methods
      if (document.documentElement.requestFullscreen) {
        document.documentElement.requestFullscreen();
      } else if (document.documentElement.mozRequestFullScreen) {
        document.documentElement.mozRequestFullScreen();
      } else if (document.documentElement.webkitRequestFullscreen) {
        document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
      }
    } else {
      if (document.cancelFullScreen) {
        document.cancelFullScreen();
      } else if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen();
      } else if (document.webkitCancelFullScreen) {
        document.webkitCancelFullScreen();
      }
    }
  }

  $('#trigger_fullscreen').click(function () {
    toggleFullScreen();
  });
}

$(document).ready(function () {
  handleFullScreenMode();
});

有没有办法像点击 F11 那样在换页时保留它？

Answer 1

不幸的是没有。

全屏将仅在当前或降序浏览器上下文中运行的API specifies。

当页面改变或刷新时，浏览器上下文改变，全屏效果丢失。

MDN also reinforces 与：

... navigating to another page, changing tabs, or switching to another application (using, for example, Alt-Tab) while in fullscreen mode exits fullscreen mode as well.

更改页面或刷新时失去全屏

loosing full-screen when changing pages or refreshing

javascript

fullscreen