单击一个元素时延迟window.setInterval（）函数

Question

这是我的代码：

window.setInterval(function(){
            if(cursor == number_of_images-1){
                cursor=-1;
            }
            cursor = cursor+1;
            var mar = cursor*940;
                    $("#innerslider").delay(1000).animate({"margin-left":-mar+"px"}, {duration: 1000, queue: true});

            }, 5000);

它的工作是不断更改margin-left的{​​{1}}属性，它运行正常。 现在我想确保当点击页面上的某个元素时，上面的函数不会运行到下一个五秒。我怎么能这样做？

Answer 1

使处理程序成为命名函数，并从启动间隔获取句柄，以便您可以停止并重新启动它：

function intervalHandler(){
  if(cursor == number_of_images-1){
    cursor=-1;
  }
  cursor++;
  var mar = cursor*940;
  $("#innerslider").delay(1000).animate({"margin-left":-mar+"px"}, {duration: 1000, queue: true});
}

var timer = window.setInterval(intervalHandler, 5000);

$('#someElement').click(function(){
  window.clearInterval(timer);
  timer = window.setInterval(intervalHandler, 5000);
});