23

ブラウザの状態に応じてAJAXリクエストをヒットしたいので、ブラウザの最小化および最大化された状態を見つけようとしています。

JavaScript を使用してブラウザの状態を検出する方法を知っている人はいますか?

4

4 に答える 4

31

これらの状態を検出する唯一の信頼できる方法は、特定のプロパティとイベントを提供するHTML5（これはまだ実験的な機能です）によって提供される可視性APIをチェックすることだと思います

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

これはクロスブラウザでは機能せず、特定のブラウザバージョンでのみ利用可能であることに注意してください。

于 2012-04-26T07:12:36.813 に答える
4

別の質問に対するPiotrek Deの回答は次のとおりです。

GitHub で利用できるきちんとしたライブラリがあります。

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

例：

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

所有しているすべてのブラウザでバージョン 1.0.1 をテストしましたが、次のブラウザで動作することを確認できます。

  • IE9、IE10
  • FF26.0
  • クロム 34.0

おそらくすべての新しいバージョン。

以下では完全には機能しません:

  • IE8 - タブ/ウィンドウが現在アクティブであることを常に示します (.now() は常に true を返します)
于 2014-11-10T10:54:17.923 に答える
3

私はこのコードを使用します

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

window.addEventListener('focus', function(){
   console.log('focus');
}, false);
于 2012-04-26T07:23:35.843 に答える
1

Page Visibility APIを試すことができます。このAPIには、現在のページが最小化されているか最大化されているかを検出するブールプロパティdocument.hidden（document.webkitHidden）があります。また、ユーザーが現在のブラウザタブにフォーカスしているかどうかにも依存します。

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

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

于 2012-04-26T07:12:15.927 に答える