如何绑定“退出全屏 f11”浏览器按钮？答案

【问题标题】：How do i bind "Exit Full Screen f11" browser button?如何绑定“退出全屏 f11”浏览器按钮？
【发布时间】：2013-09-24 12:45:59
【问题描述】：

我创建了一个链接以使用此代码全屏显示，来自onclick go full screen

function toggleFullScreen() {
    if ((document.fullScreenElement && document.fullScreenElement !== null) ||    
       (!document.mozFullScreen && !document.webkitIsFullScreen)) {
    if (document.documentElement.requestFullScreen) {  
      document.documentElement.requestFullScreen();  
    } else if (document.documentElement.mozRequestFullScreen) {  
      document.documentElement.mozRequestFullScreen();  
    } else if (document.documentElement.webkitRequestFullScreen) {  
      document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);  
    }  
  } else {  
    if (document.cancelFullScreen) {  
      document.cancelFullScreen();  
    } else if (document.mozCancelFullScreen) {  
      document.mozCancelFullScreen();  
    } else if (document.webkitCancelFullScreen) {  
      document.webkitCancelFullScreen();  
    }  
  }  
}

现在，当浏览器处于全屏模式时，我如何绑定浏览器的 “退出全屏 f11” 按钮，该按钮弹出在窗口顶部做一些回调 窗口通过退出全屏进入正常模式后？

【问题讨论】：

标签： javascript jquery events javascript-events

【解决方案1】：

试试这个 -

var fullScreen = 0;
$( window ).keydown(function(e) {
    var code = (e.keyCode ? e.keyCode : e.which);
    if (code == 122) {
        if(fullScreen == 1) {
            ....
            //your code goes here
            ....
        }
        fullScreen = (fullScreen == 1) ? 0 : 1;
    }
});

我认为这应该适用于大多数浏览器

【讨论】：

如果它解决了你的问题，请接受这个答案......同时我会尝试在不同的浏览器上测试它......
实际上，我使用了这个和其他替代方法，例如单击 ESC 按钮。但我想绑定点击退出全屏按钮。

【解决方案2】：

经过研究，我发现无法绑定那个按钮。因为那是浏览器的原生按钮，超出了 DOM 的范围。

因此，请改用按键事件侦听器。

【讨论】：