サーバーからデータをフェッチすることにより、AJAX で約 5 秒ごとに更新される Web ページがあります。ただし、ユーザーがページをアクティブに表示しているときにのみ更新を実行したいと思います。
ユーザーが別のタブにいる場合、ブラウザー以外の別のプログラムを使用している場合、またはページがユーザーの PC のメインのアクティブなページではない場合は、更新を実行しないでください。
これをテストする最も正確なクロスブラウザの方法は何ですか?
サーバーからデータをフェッチすることにより、AJAX で約 5 秒ごとに更新される Web ページがあります。ただし、ユーザーがページをアクティブに表示しているときにのみ更新を実行したいと思います。
ユーザーが別のタブにいる場合、ブラウザー以外の別のプログラムを使用している場合、またはページがユーザーの PC のメインのアクティブなページではない場合は、更新を実行しないでください。
これをテストする最も正確なクロスブラウザの方法は何ですか?
jQuery idleTimer プラグインは、必要なことを正確に実行する必要があります。
ドキュメントはこちら: http://paulirish.com/2009/jquery-idletimer-plugin/
デモはこちら: http://ajaxdump.com/?8ADKBT6O
純粋なJSの方法を好む場合は、次の解決策があります。
(function(){
var itl=null;
window.onfocus=function(){itl=window.setInterval(/*heartbeat function*/,5000);};
window.onblur=function(){if(itl){window.clearInterval(itl);}};//stop heartbeat
})();
ただし、フレーム内では機能しません。スタンドアロンタブでテストする必要があります。