Question

我们正在尝试将我们的网络应用程序作为全屏网络应用程序运行。我使用这些元标记让它工作：

    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="default">
    <meta name="apple-mobile-web-app-title" content="Full Screen">

现在，当您从iPhone或Android设备上的主屏幕启动网络应用程序时，它将全屏启动（没有浏览器控件）。

现在我们需要一种允许用户退出的方法，我希望创建一个具有退出按钮的菜单但是使用window.close（）在chrome中给出了以下错误：

Scripts may close only the windows that were opened by it.

处理此问题的正确方法是什么？

Answer 1

关闭全屏模式的一种方法是使用以下脚本：

 function exitFullScreen(element) { 
        var requestMethod = element.exitFullscreen ||
                                                  element.mozCancelFullScreen || 
                                                  element.webkitExitFullscreen || 
                                                  element.msExitFullscreen; 
         if (requestMethod) { 
               requestMethod.call(element); 
         } else { 
               console.log("Oops. Request method false."); 
          } 
     }

然后把它称为：

       var $smallscreenButton = $("#smallscreen-button"); 
       $smallscreenButton.on("click", function() { 
                    var elem = document;
                    exitFullScreen(elem); 
        });

你用window.close（）分阶段的错误是你应该用window.open（）在同一个javascript中打开窗口然后它应该已经正确关闭了。你无法用javascript关闭随机窗口，这就是为什么你不能在没有先打开的情况下调用close。

所以，就像：

 var myWindow = window.open();
 myWindow.close(); // this works.

来源：

[1] How can we programmatically enter and exit the fullscreen mode in javascript?

[2] window.close() doesn't work - Scripts may close only the windows that were opened by it

Answer 2

这是关于How to user HTML5 fullscreen api

的精彩教程

由此，退出全屏：

if (document.exitFullscreen) {
    document.exitFullscreen();
} else if (document.webkitExitFullscreen) {
    document.webkitExitFullscreen();
} else if (document.mozCancelFullScreen) {
    document.mozCancelFullScreen();
} else if (document.msExitFullscreen) {
    document.msExitFullscreen();
}

您可以在任何DOM元素的click方法中编写上述代码，例如使用jquery：

$("#exitFullScreen").click(function(){
    // the above code
        if (document.exitFullscreen) {
        document.exitFullscreen();
    } else if (document.webkitExitFullscreen) {
        document.webkitExitFullscreen();
    } else if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen();
    } else if (document.msExitFullscreen) {
        document.msExitFullscreen();
    }
});

其他参考资料：

如何退出全屏Web应用程序

2 个答案: