1

何らかのアクションを実行した人数のリアルタイム更新を表示する必要があります。20 秒ごとにサーバーに ajax リクエストを送信することで、この機能を実装しました。しかし、この ajax リクエストは、タブがフォーカスされていない場合や誰も更新を見ていなくても発生します。タブがアクティブかどうかを確認する方法はありますか?

次のコード (簡易版) がありますが、動作しません。

timer = undefined
$(document).ready ->
  timedCountUpdate()
  window.top.onblur = ->
    clearTimeout(timer)
  window.top.onfocus = ->
    timer = timedCountUpdate()

@timedCountUpdate = () ->
  timer = setTimeout(updateCountIndicator, 20000)

@updateCountIndicator = () ->
  $('.indicator').html = 100
  timedCountUpdate()

アプリがロードされているタブにいない場合でも、20 秒ごとに呼び出しが行われます。私はクロムでテストしています。

4

3 に答える 3

2

jquery を使用した Coffeescript の場合:

$ ->
  timeout_id = null

  resumeTimer = () ->
    # make ajax call here

    # Prevent multiple timers from operating simultaneously:
    clearTimeout timeout_id if timeout_id?

    # Recursive step (ideally fires in 'success' handler of ajax call)
    timeout_id = setTimeout(resumeTimer, 2000)

  $(window.top).focus () =>
    resumeTimer()
  $(window.top).blur () =>
    clearTimeout timeout_id

  # Start timer immediately:
  resumeTimer()
于 2013-10-01T22:21:21.367 に答える