Javascript 切换全屏退出_Javascript_Html_Toggle_Fullscreen

Javascript 切换全屏退出

javascript html

Javascript 切换全屏退出,javascript,html,toggle,fullscreen,Javascript,Html,Toggle,Fullscreen,我的HTML中有一个按钮触发了以下javascript： function toggleFullScreen(){ if(v.requestFullScreen){ v.requestFullScreen(); } else if(v.webkitRequestFullScreen){ v.webkitRequestFullScreen(); } else if(v.mozRequestFullScreen){

我的HTML中有一个按钮触发了以下javascript：

function toggleFullScreen(){

    if(v.requestFullScreen){
        v.requestFullScreen();
    }
    else if(v.webkitRequestFullScreen){
        v.webkitRequestFullScreen();
    }
    else if(v.mozRequestFullScreen){
        v.mozRequestFullScreen();
    }
}

我如何扩展此JS代码，使其能够退出全屏？这方面的最佳实践是什么

你尝过这个吗

exitFullscreen();
mozCancelFullScreen();
webkitExitFullscreen();
msExitFullscreen();

看那里：

或：

这对您有足够的帮助吗？

实际上有一个关于MDN的完整功能示例：

引述：

切换全屏模式

如上图所示，当用户点击Enter键时调用此代码

function toggleFullScreen() {
  if (!document.fullscreenElement &&    // alternative standard method
      !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement ) {  // current working methods
    if (document.documentElement.requestFullscreen) {
      document.documentElement.requestFullscreen();
    } else if (document.documentElement.msRequestFullscreen) {
      document.documentElement.msRequestFullscreen();
    } else if (document.documentElement.mozRequestFullScreen) {
      document.documentElement.mozRequestFullScreen();
    } else if (document.documentElement.webkitRequestFullscreen) {
      document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
    }
  } else {
    if (document.exitFullscreen) {
      document.exitFullscreen();
    } else if (document.msExitFullscreen) {
      document.msExitFullscreen();
    } else if (document.mozCancelFullScreen) {
      document.mozCancelFullScreen();
    } else if (document.webkitExitFullscreen) {
      document.webkitExitFullscreen();
    }
  }
}

首先查看fullscreenElement属性的值在文档上（检查以moz、ms和webkit作为前缀的文档）。如果为空，则文档当前处于窗口模式，因此我们需要切换到全屏模式。切换到全屏模式由调用element.mozRequestFullScreen（）msRequestFullscreen（）或 webkitRequestFullscreen（），具体取决于可用的

如果全屏模式已激活（fullscreenElement为非空），我们称document.mozCancelFullScreen（）、msExitFullscreen或 webkitExitFullscreen（），这同样取决于正在使用的浏览器

从以下位置获取jQuery：

从以下位置获取screenfull.min.js：

‎将它们包括在

…

将id分配给

ex.mainBody

将功能放在关闭主体标签之前，即。

<script src="js/jquery.js"></script> 
<script src="js/screenfull.min.js"></script> 
</head>

<body id="mainBody">
<!--[whatever]-->
<script>
             $(function tScreen()
             {
              if(!screenfull.enabled) 
              { return false; }
              screenfull.request(document.getElementById('mainBody'));
             });

             $('#toggle').click(function () 
             { screenfull.toggle($('#mainBody')[0]);});
       </script>
</body>
</html>


$（函数tScreen（）
{
如果（！screenfull.enabled）
{返回false；}
screenfull.request（document.getElementById（'mainBody'）；
});
$（“#切换”）。单击（函数（）
{screenfull.toggle（$（'#mainBody'）[0]）；}；

如何将这些函数应用到代码中？我已经尝试了一个小时：）谢谢你的及时回复，我已经检索到了所需的函数！没问题：）你能用粗线标出我的答案吗？谢谢lot@Chris代码是我从网站上发给你们的：D这是偷窃：Djust即将发布此代码，精彩资源，谢谢你们这么及时！将在2分钟内接受，信誉++：）这将仅在某些元素请求全屏时有效。如果全屏幕由浏览器本身启动（例如，当用户按下F11时），则此操作将不起作用。请使用，查看。