setInterval время становится быстрее после каждого цикла

Question

Привет Я пытаюсь отслеживать время, проведенное пользователем на веб-странице. Поэтому я написал для этого javascript.

Сценарий начинает отслеживать время, когда окно становится сфокусированным, а затем приостанавливается, если пользователь переходит на другую вкладку или сводит к минимуму окно.

here is the fiddle:

Ниже приведен код:

$(function(){ 
    var count = 0; 
    var interval; 

    var ispaused=false; 
    function setPause(){ 
     ispaused=true; 
    } 

    function unpause(){ 
     ispaused=false; 
    } 

    $(window).on("blur focus", function(e) { 
     var prevType = $(this).data("prevType"); 

     if (prevType != e.type) { // reduce double fire issues 
      switch (e.type) { 
       case "blur": 
        setPause(); 
        clearInterval(interval); 
        break; 
       case "focus": 
        unpause(); 
        var interval = setInterval(
         function(){ 
          if(!ispaused) { 
           $('#timer').text(count += 1); 
          } 
         },1000 
        ); 
        break; 
      } 
     } 

     $(this).data("prevType", e.type); 
}); 

}); 

Таймер запускается, когда вы сосредоточены области и пауз, когда вы размыть, но таймер становится быстрее после каждого цикла фокуса и размытия. Не знаю, почему это происходит. Пожалуйста помоги !

Answer 1

Я проверил скрипку вы предоставили, и обнаружил, что вы храните переменный интервал на локальном переменном я попытался решить эту проблему, чтобы увидеть, если он работает и обновил скрипку здесь:

http://jsfiddle.net/9fzd1dap/1/

Это обновленный скрипт

$(function() { 
     var count = 0; 
     var interval; //This is the global interval variable 

     var ispaused = false; 
     function setPause() { 
      ispaused = true; 
     } 

     function unpause() { 
      ispaused = false; 
     } 

     $(window).on("blur focus", function (e) { 
      var prevType = $(this).data("prevType"); 

      if (prevType != e.type) { // reduce double fire issues 
       switch (e.type) { 
        case "blur": 
         setPause(); 
         break; 
        case "focus": 
         unpause(); 
         clearInterval(interval); 
         //I removed the var keyword from the line below to prevent dual declarations. 
         interval = setInterval(
          function() { 
           if (!ispaused) { 
            $('#timer').text(count += 1); 
           } 
          }, 1000 
         ); 
         break; 
       } 
      } 

      $(this).data("prevType", e.type); 
     }); 

    }); 

что случилось, что глобальный интервал переменная не заполняется и Локальный интервал (внутри функции) является переменной, которая заполняется. Я уже тестировал его на обновленной скрипке и, похоже, отлично работает;)