Jquery幻灯片特效，点击后需要延迟

Question

我有5张幻灯片，它们在5秒后或鼠标点击后改变(用SetInterval函数完成，它会触发‘点击’)

问题如下，例如:假设它被设置为#slide_1，当4秒过去，我手动点击#slide_2时，下一张幻灯片(#slide_3)在1秒后激活。这都是SetInterval，会触发点击，我不知道如何在手动点击和SetInterval点击之间添加5秒的间隔。

这是我的代码，

    setInterval(function() {
       if(!$('.buttons > ul ').children('.butt_press').next().length){
            $('.buttons > ul').children(':first').trigger('click');
       }
       else{
            $('.buttons > ul').children('.butt_press').next().trigger('click');
       }
   }, 5500);

谢谢

Answer 1

setInterval返回一个间隔id，您可以使用它清除该间隔，然后重新创建它。

var nextSlide = function () {
   if(!$('.buttons > ul ').children('.butt_press').next().length){
        $('.buttons > ul').children(':first').trigger('click');
   } else {
        $('.buttons > ul').children('.butt_press').next().trigger('click');
   }
};

var interval = setInterval(nextSlide, 5000);

$('some_selector').on('click', function () {
  nextSlide();
  clearInterval(interval);
  interval = setInterval(nextSlide, 5000);
});