1

При создании страницы запускается таймер, я хочу чтобы при движении мыши по странице таймер запускался по новой. Но сейчас работает не корректно. Например отсчет идет с 5:00 и доходит до 4:30 в этот момент я дергаю мышью и таймер обновился до 5:00 а потом резко продолжает с 4:30, а надо чтобы продолжался 4:59, 58, 57 и.т.д. Как правильно перезапустить функцию?

  $( document ).ready(function(){
            timer();
        });

        $('body').on('mousemove mousedown',function(){
            timer();
        });

function timer() {
            var duration = 60 * 5;
            var timer = duration, minutes, seconds;

            setInterval(function() { // запускаем интервал
                minutes = parseInt(timer / 60, 10);
                seconds = parseInt(timer % 60, 10);

                minutes = minutes < 10 ? "0" + minutes : minutes;
                seconds = seconds < 10 ? "0" + seconds : seconds;

                if (--timer < 0) {
                //обновить таймер timer = duration;
                        location.reload();
            }
                $('#timer').text(minutes + ":" + seconds);
                }, 1000);
        };

1 ответ 1

1

Я вынес переменные timer, minutes и seconds из функции старта таймера в общую область видимости с функцией слушающей движения мышки и клики, в которой переинициализирую их

  timer = duration;
  minutes = 0;
  seconds = 0;

var duration = 60 * 5;
var timer = duration, minutes, seconds;

$( document ).ready(function(){
    startTimer();
});

$(window).on('mousemove mousedown',function(){
  timer = duration;
  minutes = 0;
  seconds = 0;
});

function startTimer() {
    setInterval(function() { // запускаем интервал
        minutes = parseInt(timer / 60, 10);
        seconds = parseInt(timer % 60, 10);

        minutes = minutes < 10 ? "0" + minutes : minutes;
        seconds = seconds < 10 ? "0" + seconds : seconds;

        if (--timer < 0) {
        //обновить таймер timer = duration;
                location.reload();
        }
        $('#timer').text(minutes + ":" + seconds);
    }, 1000);
};
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="timer"></div>

1
  • Спасибо! Помогло!
    – BorsheC
    12 апр 2019 в 5:59

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.