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

时间:2013-12-04 15:27:21

标签: javascript fullscreen event-listener

根据this我试图检测全屏状态变化。使用以下事件侦听器功能,每次全屏状态更改时(进入全屏时和取消全屏时)都会执行其间的代码。但是我想在全屏取消时才执行我的代码。是否有一种简单的方法可以每隔一次在该函数中执行我的代码(我知道它快速而且很脏)甚至更好:如何检测取消全屏并在之后执行代码?

这里是代码:

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

1 个答案:

答案 0 :(得分:2)

你可以使用一个跟踪你的状态的布尔值(当你没有全屏时全屏是错误的。)

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
}

不确定浏览器的兼容性。