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

Question

我创建了一个链接，使用此代码从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”按钮，该按钮会弹出窗口以执行回调窗口在退出全屏后进入正常模式？

Answer 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;
    }
});

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

Answer 2

经过研究，我发现无法绑定该按钮。因为这是浏览器的本机按钮，这超出了DOM的范围。

  

所以，请改用keypress事件监听器。