如何在每次第二次事件发生时在事件监听器中执行函数？

Question

根据这一点，我试图检测全屏状态变化。 使用以下事件侦听器功能，每次全屏状态更改时（进入全屏时和取消全屏时）都会执行其间的代码。 但是我想在全屏取消时才执行我的代码。 是否有一种简单的方法可以在每秒钟内执行我的代码（我知道它快速和脏）或甚至更好：如何检测取消全屏并在之后执行代码？

这里的代码：

var fullscreenState = $('#wrapper');
document.addEventListener("fullscreenchange", function () {
fullscreenState.innerHTML = (document.fullscreen)? "" : "not ";        
            alert('fullscreen');
}, false);

document.addEventListener("mozfullscreenchange", function () {
fullscreenState.innerHTML = (document.mozFullScreen)? "" : "not ";
        alert('fullscreen');

}, false);

document.addEventListener("webkitfullscreenchange", function () {
fullscreenState.innerHTML = (document.webkitIsFullScreen)? "" : "not ";       
        alert('fullscreen');

}, false);

Answer 1

您可以使用一个跟踪状态的布尔值（当您不在全屏模式时全屏显示为false）。

var fullscreen;
document.addEventListener("fullscreenchange", function () {
  if (fullscreen = !fullscreen) return;
  /* code here is executed only when fullscreen is canceled */

  fullscreenState.innerHTML = (document.fullscreen)? "" : "not ";        
            alert('fullscreen');
}, false);

MDN还提供了一些有关如何在不依赖快速和脏的黑客攻击的情况下检查全屏状态的信息：

https://developer.mozilla.org/en-US/docs/Web/Reference/Events/fullscreenchange

if ( document.fullscreenEnabled ) {
  // code here
}

虽然不确定它的浏览器兼容性。