如何在浏览器选项卡处于焦点时运行setInterval?

时间:2016-04-17 07:31:40

标签: javascript jquery setinterval

我创建了一个Interval,当页面加载时每2秒运行一次。现在,当我移动到其他页面时,间隔被清除(请检查代码)。现在我想要的是当我再次移动到同一个标签时,间隔应该重新开始。

我尝试过的一件事是我在$(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);
    });
  });
}

1 个答案:

答案 0 :(得分:2)

  

我尝试过的一件事是我在$(window).focus(//CODE)内编写了整个代码,但问题是当页面最初在任何浏览器的标签页面中打开时它都不会运行。

好的,这里的问题是,setInterval()不会在0秒执行。它仅从2秒开始。所以你需要做一个小改动:

  1. 单独使用此功能。
  2. ready事件内,启动计时器,并首次运行该功能。
  3. 从间隔中删除事件处理程序,或仅使用.one()分配一次。您反复添加到窗口的.blur()事件。
  4. 更正后的代码:

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