Javascript 仅适用于 Google Chrome 的调试模式

Question

下面的代码在 Internet Explorer 中运行良好，但在 Chrome 中它只有在您处于调试模式时才能运行，这是怎么回事？

window.onresize = function (e) {
 if (window.outerWidth === screen.width && window.outerHeight == screen.height) {
    if (!fullscreen) {
        fullscreen = true;
        onfullscreenchange(true);
    }
 } else {
    if (fullscreen) {
        fullscreen = false;
        onfullscreenchange(false);
    }
  }
};


function onfullscreenchange(full) {
    alert(full);
}

Answer 1

试试这个

var fullscreen;

window.onresize = function (e) { 
 if (window.outerWidth === screen.width && window.outerHeight == screen.height) {
    console.log('fullscreen');
    if (fullscreen !== 1) {
        fullscreen = 1;
        onfullscreenchange(true);
    }
 } else {
    console.log('!fullscreen');
    if (fullscreen !== 0) {
        fullscreen = 0;
        onfullscreenchange(false);
    }
  }
};


function onfullscreenchange(full) {
    alert(full);
}

Answer 2

这里是一个监听窗口是否已按 F11 全屏显示的示例。此代码不仅侦听 resize 事件，还侦听 F11，因为在 Chrome 中进入全屏模式时不会触发 resize 事件。

// Function to check if the window is fullscreened or not
var isFullscreen = function(){
  return (window.outerWidth === screen.width && window.outerHeight === screen.height);
};

// Function to run when window size has changed
var screenSizeChange = function(){
  if (isFullscreen()) {
    document.querySelector('body').innerHTML = 'You are in fullscreen mode';
  } else {
    document.querySelector('body').innerHTML = 'You are in windowed mode';
  }
};

// Run screenSizeChange when `resize` event is triggered
window.addEventListener('resize', screenSizeChange, false);

// Run screenSizeChange when F11 is pressed
window.addEventListener('keyup', function(e){
  if (e.keyCode === 122) { // Listen for F11
    screenSizeChange();
  }
}, false);

现场版试用：http://jsbin.com/ciqeb/4/edit?js,output