Задержка таймера, когда вкладка неактивна или браузер свернут - PullRequest
Новая
       22

Задержка таймера, когда вкладка неактивна или браузер свернут

0 голосов
/ 04 ноября 2018

У меня есть следующий код, чтобы показать таймер для приложения онлайн-викторины. По завершении мне нужно перенаправить на другую страницу через ajax. Код работает для меня, но я обнаружил, что таймер задерживается, когда мы перемещаем вкладки или сворачиваем браузер. 

          var mins = 5;
          var secs = 0; // Seconds (In addition to min) test time
          var timerDisplay = $(document).find('#timerspan'); 
          //Globals: 
          var timeExpired = false;

          // Test time in seconds
          var totalTime = secs + (mins * 60);

        var countDown = function (callback) { 
            var interval;
            interval = setInterval(function () {
                if (secs === 0) {
                    if (mins === 0) {
                        timerDisplay.text('0:00');
                        clearInterval(interval);
                        callback();
                        return;
                    } else {
                        mins--;
                        secs = 60;
                    }
                }
                var minute_text;
                if (mins > 0) {
                    minute_text = mins;
                } else {
                    minute_text = '0';
                }
                var second_text = secs < 10 ? ('0' + secs) : secs;

                timerDisplay.text(minute_text + ':' + second_text);
                secs--;
            }, 1000, timeUp);
        };

            // When time elapses: submit form
            var timeUp = function () { 
                alert("Time's Up!");
                timeExpired = true;
                var completed=1;
                $.ajax({
                  type:"POST",
                   url:"success.php",
                   data:{'userID':<?php echo $_SESSION['userID'];?>},
                   success: function (hasil) {
                      $('.response_div').html(hasil);
                   }  
                });
            };

            // Start the clock
            countDown(timeUp);
...