Javascript请求全屏显示不可靠

Question

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

https://developer.mozilla.org/en/DOM/Using_full-screen_mode#AutoCompatibilityTable

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

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

通常设置为全屏。它可以进入一种状态，该状态将停止工作，但警报仍然会发生，即它仍在请求FullScreen，但它不起作用。

如果从按键处理程序（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

我知道这是一个很老的问题，但是当mozRequestFullScreen()从未由任何用户交互触发的代码调用时搜索FireFox的错误消息时，它仍然是Google的最高结果。由于未从短暂运行的用户生成的事件处理程序内部调用Element.mozRequestFullScreen（），因此拒绝全屏请求。如前所述，这是一个安全设置，因此在正常的浏览器环境（最终用户计算机）中是正确的行为。但是我正在编写一个基于HTML5的数字标牌应用程序，该应用程序可以在受控环境下运行，而无需任何用户交互。能够自动切换到全屏对我的应用至关重要。幸运的是，FireFox可以消除浏览器上的这种限制，这很难找到。我将在这里编写它，作为以后像我一样通过Google搜索找到此页面的每个人的参考。在about:config页面上搜索以下项并将其设置为falsefull-screen-api.allow-trusted-requests-only对于我的数字标牌应用程序，我还删除了输入fullscren时浏览器显示的提示：full-screen-api.approval-required希望这可以节省我浪费在寻找这些设置上的时间。

Answer 2

您的功能没有错。在Firefox中，如果您直接调用该函数，则会阻止进入全屏模式。如您所知，由于docElm.mozRequestFullScreen（）;，全屏请求被拒绝了。没有从运行时间较短的用户生成的事件处理程序内部调用。因此，您必须在Firefox等onClick事件上调用该函数。<a href="#" onClick="DoFullScreen()">Full Screen Mode</a>