如何检测浏览器最小化和最大化JavaScript中的状态

我试图find浏览器最小化和最大化状态,因为我想打AJAX请求相应的浏览器状态。

有谁知道如何使用JavaScript检测浏览器状态。

我认为检测这些状态的唯一可靠方法是检查由HTML5提供的可见性API (这仍然是一个实验性function),它提供了某些属性和事件

document.hidden // Returns true if the page is in a state considered to be hidden to the user, and false otherwise. document.visibilityState // Returns a string denoting the visibility state of the document 

您也可以对可见性的变化作出反应

 document.addEventListener("visibilitychange", function() { console.log(document.hidden, document.visibilityState); }, false); 

请记住,这是不工作的跨浏览器,只有在某些浏览器版本。

以下是Piotrek De 对另一个问题的回答 :

在GitHub上有一个整洁的库:

https://github.com/serkanyersen/ifvisible.js

例:

 // If page is visible right now if( ifvisible.now() ){ // Display pop-up openPopUp(); } 

我已经在所有浏览器上testing过版本1.0.1,并且可以确认它适用于:

  • IE9,IE10
  • FF 26.0
  • Chrome 34.0

并可能是所有新版本。

不完全适用于:

  • IE8 – 总是指示标签页/窗口当前处于活动状态(.now()对我来说总是返回true)

您可以尝试页面可见性API,它具有布尔属性document.hidden(document.webkitHidden),它也检测当前页面是最小化还是最大化。 这也取决于用户是否关注了当前的浏览器选项卡:

https://developers.google.com/chrome/whitepapers/pagevisibility

https://developer.mozilla.org/en/DOM/Using_the_Page_Visibility_API

我使用这个代码

 window.addEventListener('blur', function(){ console.log('blur'); }, false); window.addEventListener('focus', function(){ console.log('focus'); }, false);