перезапуск метода setInterval

поэтому у меня есть таймер, который вращает набор изображений за 5 секунд. Поэтому я запускаю это при запуске документа.

$(document).ready(function() {
var intervalID=setInterval(function(){ 
     rotate();    
}, 5000);
});

Функция Rotate просто просто вращает изображения. Однако я также разрешаю пользователю вручную выбирать, на какое изображение они смотрят. Из-за этого мне нужно отменить SetInterval, а затем снова запустить его через 5 секунд

то, что я пытаюсь сделать, это отменить интервал, а затем начать его снова, выполнив это

$('a').click(function(){
 clearInterval(intervalID);   
 intervalID=setInterval(function(){ 
     rotate();    
}, 5000);    
});

однако код, похоже, не сбрасывает интервал, как я надеялся.

7
clearinterval javascript jquery setinterval

3 ответов

просто сделать intervalID быть глобальной переменной, объявив ее вне и выше всех функций.

С вашим текущим кодом его область действия ограничена $(document).ready() метод, поэтому это может вызвать проблему, которую вы описываете.

4

Если intervalID переменная объявляется в пределах .ready() объем, следующее должно работать (непроверенных):

$(document).ready(function() {
    var rotate = function() { ... },
        intervalID = setInterval(rotate, 5000);

    $('a').click(function() {
       clearInterval(intervalID);   
       intervalID = setInterval(rotate, 5000);    
    });
});
5

Ну, похоже, вы объявляете interverID локально в анонимной функции из вашего .ready() обработчик. Мне на самом деле интересно, почему вы не сталкиваетесь с ссылка ошибка в вашем обработчике событий click-event, так как intervalID не может быть известна.

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

(function _myPrivateContext($, window, document, undefined) {
    var intervalID = null;

    $(document).ready(function() {
       intervalID = setInterval(rotate, 5000);
    });

    $('a').click(function(){
        clearInterval(intervalID);   
        intervalID = setInterval(rotate, 5000);    
    });

}(jQuery, window, document));
3