JQuery:. Остановка и запуск «setInterval»

Question

У меня есть слайд-шоу на моем сайте, но есть проблема с в

Вот, мои JS:

var size_ini = 1; 
$(document).ready(function() { 
    setInterval('$("#next").click()',10000) 
    $("#next").click(function() { 
     if(size_ini < 3); 
     size_ini++; 
     else 
     size_ini = 1 
     $(".sample").hide(); 
     $("#id" + size_ini).show(); 
     $(".comment" + size_ini).show(); 
     $(".comment_description" + size_ini).show(); 
    }); 
    $("#prev").click(function() { 
     if(size_ini > 1) 
     size_ini--; 
     else 
     size_ini = 3; 
     $(".sample").hide(); 
     $("#id" + size_ini).show(); 
     $(".comment" + size_ini).show(); 
     $(".comment_description" + size_ini).show(); 
    }); 
}); 

Как вы можете видеть, я имеют таймер 10 сек. для слайдов. У меня есть предыдущая и следующая кнопка. Поэтому, когда я нажал на одну из кнопок, таймер должен остановиться и начать снова. Я попробовал «clearInterval», но это не работает.

Может ли кто-нибудь сказать, как это работает.

Адрес FIDDLE.

Answer 1

Fiddle Demo

var size_ini = 1; 
$(document).ready(function() { 
    var timer = setInterval('$("#next").click()', 10000); //assign timer to a variable 
    $("#next").click(function() { 
     if (size_ini < 3) size_ini++; 
     else size_ini = 1 
     $(".sample").hide(); 
     $("#id" + size_ini).show(); 
     clearInterval(timer); //clear interval 
     timer = setInterval('$("#next").click()', 10000); //start it again 
    }); 
    $("#prev").click(function() { 
     if (size_ini > 1) size_ini--; 
     else size_ini = 3; 
     $(".sample").hide(); 
     $("#id" + size_ini).show(); 
     clearInterval(timer); //clear interval 
     timer = setInterval('$("#next").click()', 10000); //start it again 
    }); 
}); 

Answer 2

Если вы собираетесь хотите, чтобы очистить интервал вам нужно присвоить его переменной, то вы можете очистить его легко -

var myInterval = setInterval('$("#next").click()',10000); 

Тогда ясно например:

clearInterval(myInterval); 

После интервала был очищен, не забудьте сбросить его и снова присвоить его переменной, если вы хотите продолжить ее.

Answer 3

<button id="start">Start</button> 
<button id="stop">Stop</button> 

var timer; 
$("#start").click(function() { 
    timer = setInterval(function(){$("#next").trigger("click");},"500"); 
}); 
$("#stop").click(function() { 
    clearInterval(timer); 
});