ブラウザtabリフレッシュ実装の切り替え

928 ワード

ラベル:js
に縁を付ける
最近1つの活动の需要をして、需要のインタラクティブはプロジェクトにまたがって、别のプロジェクトの中で指定の任务を完成して、更に帰って相応の任务の奨励金を受け取って、制品はとてもユーザーに自発的にブラウザを更新してやっと活动のページの任务の情报を更新することを要求することに反感を持っています.
ソリューション
  • シナリオ1:プロジェクトがie 10以下のブラウザを考慮しない場合、html 5に追加されたPage Visibility APIによって実現でき、サンプルコードは以下の通りである:
  • document.addEventListener('visibilitychange', function() { 
      var isHidden = document.hidden; 
      if (!isHidden) { 
        //        ,                
      } 
    });
    
  • スキーム2:互換性に一定の要件がある場合、現在のウィンドウでフォーカスjsイベントを取得することを考慮することができ、サンプルコードは以下の通りである:
  • //         
    window.onfocus = function() { 
      //        ,                 
    }; 
    
  • シナリオ3:データポーリング要求を行い、数秒おきにデータ更新を行う.
  • 案4:切替リフレッシュをしたいエリアにリフレッシュボタンを置いて、現在のエリアデータを更新するかどうかを製品と相談することができます.

  • 最終選択
    制品はIE 8+に対応することを要求して、方式1は放弃して、私はまたポーリングのリフレッシュをしたくなくて、サーバーの圧力を増加して、方式3も放弃して、制品と商谈して1つの局部のリフレッシュボタンを増加して、制品は丑いことを嫌って、そこで最终的に方案2を选びました