2016-04-17 9 views
3

ページが読み込まれたときに2秒ごとに実行される間隔を作成しました。今、他のページに移動すると、間隔がクリアされます(コードを確認してください)。今私が欲しいのは、同じタブに再び移動すると、間隔が再び始まるはずです。ブラウザタブにフォーカスがあるときにsetIntervalを実行するにはどうすればいいですか?

私が試したことは、このコード全体を$(window).focus(//CODE)の中に書きましたが、ページが最初にブラウザのタブで開かれたときに実行されないという問題がありました。

どのようにこの問題を解決できますか?

ここに私のコードです:私が試した

var zzz= setInterval(anewFunc, 2000); 
function anewFunc(){ 
    $(document).ready(function(){ 

    var chatattr=$(".chatwindow").css("visibility"); 
    var chattitle=$("#hideid").text(); 
    if(chatattr=="visible"){ 
     $.ajax({ 
     url: 'seen1.php', 
     type: 'post', 
     data: "ctitle="+chattitle, 
     success: function(result9){ 
     }, 
     error: function(){ 
     } 
     }); 

    } 
    $(window).blur(function(){ 
     $.ajax({ 
     url: 'session.php', 
     type: 'post', 
     success: function(result10){ 
      // alert(result10); 
     }, 
     error: function(){ 
     } 
     }); 
     clearInterval(zzz); 
    }); 
    }); 
} 
+0

requestAnimationFrameを使用すると、ブラウザは自動的にこれを行います。ループを一時停止して再起動します。タイミングコードを処理するだけで済みます。 – ManoDestra

答えて

2

ことの一つは、私が$(window).focus(//CODE)内部でこの全体のコードを書いたということでしたが、問題は、ページが最初に任意のブラウザの中で開かれたとき、それが実行されないということですタブ。

さて、ここで問題があり、setInterval()0秒で実行されません。それは2秒から始まります。したがって、小さな変更を加える必要があります。

  1. この機能は別途必要です。
  2. readyイベントの内部では、初めてタイマーを起動すると同時に、タイマーを起動します。
  3. 間隔からイベントハンドラを削除するか、.one()を使用して1回だけ割り当てます。 Windowsの.blur()イベントに繰り返し追加しています。

修正されたコード:

function anewFunc() { 

    var chatattr = $(".chatwindow").css("visibility"); 
    var chattitle = $("#hideid").text(); 
    if (chatattr == "visible") { 
    $.ajax({ 
     url: 'seen1.php', 
     type: 'post', 
     data: "ctitle=" + chattitle, 
     success: function(result9) {}, 
     error: function() {} 
    }); 
    } 
    $(window).one("blur", function() { 
    $.ajax({ 
     url: 'session.php', 
     type: 'post', 
     success: function(result10) { 
     // alert(result10); 
     }, 
     error: function() {} 
    }); 
    clearInterval(zzz); 
    }); 
} 

$(document).ready(function() { 
    var zzz = setInterval(anewFunc, 2000); 
    anewFunc(); 
}); 

は今、私が何をしたい私は、再び同じタブに移動すると、間隔が再び開始する必要があります。

もう一度setInterval()を開始していません。

$(document).ready(function() { 
    $(window).one("focus", function() { 
    var zzz = setInterval(anewFunc, 2000); 
    }); 
}); 
関連する問題