JavaScript请求全屏显示不可靠

Question

我正在尝试使用JavaScript FullScreen API，并从此处使用针对当前非标准实现的解决方法：

可悲的是，它的行为非常不稳定。我只关心Chrome（使用v17），但是由于遇到问题，我在Firefox 10中做了一些测试以进行比较，结果相似。

下面的代码尝试将浏览器设置为全屏，有时可以，有时不能。它总是调用警报以表明它正在请求全屏显示。这是我发现的：

• 通常设置为全屏。它可以进入一种状态，该状态将停止工作，但警报仍会发生，即它仍在请求全屏显示，但不起作用。
• 如果从按键处理程序（document.onkeypress）调用它，则可以工作，但在页面加载（window.onload）上调用时，则不能工作。

我的代码如下：

function DoFullScreen() {

    var isInFullScreen = (document.fullScreenElement && document.fullScreenElement !==     null) ||    // alternative standard method  
            (document.mozFullScreen || document.webkitIsFullScreen);

    var docElm = document.documentElement;
    if (!isInFullScreen) {

        if (docElm.requestFullscreen) {
            docElm.requestFullscreen();
        }
        else if (docElm.mozRequestFullScreen) {
            docElm.mozRequestFullScreen();
            alert("Mozilla entering fullscreen!");
        }
        else if (docElm.webkitRequestFullScreen) {
            docElm.webkitRequestFullScreen();
            alert("Webkit entering fullscreen!");
        }
    }
}

Answer 1

requestFullscreen()由于安全原因（至少在Chrome中），无法自动调用。因此，只能通过用户操作来调用它，例如：

• 单击（按钮，链接…）
• 按键（按键，按键…）

并且如果您的文档包含在框架中：

• allowfullscreen需要存在于<iframe>元素上*

• W3规范：
  “ …为防止嵌入式内容进入全屏状态，只有通过allowfullscreenHTMLiframe元素的属性专门允许的嵌入式内容才能进入全屏状态。这可以防止不受信任的内容进入全屏状态。”