一尘不染

JavaScript请求全屏显示不可靠

javascript

我正在尝试使用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!");
        }
    }
}

阅读 337

收藏
2020-05-01

共1个答案

一尘不染

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

  • 单击(按钮,链接…)
  • 按键(按键,按键…)

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

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

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

2020-05-01