jquery 如何使用setInterval和clearInterval作为函数

093gszye 于 2023-10-17 发布在 jQuery

关注(0)|答案(1)|浏览(102)

我在jQuery中使用setInterval来改变onLoad中背景图像的位置，但我想把它作为一个函数使用，这样当一个元素被点击时，我就可以调用clearInterval来停止它，当另一个元素被点击但panRight（）不能在load中工作时，我就可以再次调用这个函数。

function moveImage() {
var x = 0;
    x-=1;
    $('.bg-img').css('background-position-x', x + 'px');
}

function panRight(){
  setInterval(moveImage(),25);
}

// moveImage onLoad
panRight();

$("#stop-animation").click(function(){
  clearInterval(panRight);
});

$("#start-animation").click(function(){
  panRight();
});

下面的代码在onLoad中可以正常工作，这也是我试图重构为函数的地方。

$(function(){
  var x = 0;
  setInterval(function(){
      x-=1;
      $('.bg-img').css('background-position', x + 'px 0');
  }, 25);
})

jquery

来源：https://stackoverflow.com/questions/39173729/how-to-use-setinterval-and-clearinterval-as-functions

1条答案

按热度按时间

ssgvzors1#

你可以这样做：

function moveImage() {
    var x = 0;
    x -= 1;
    $('.bg-img').css('background-position-x', x + 'px');
}

var panInterval; // timer id

function panRight() {
  panInterval = setInterval(moveImage, 25);
}

// moveImage onLoad
panRight();

$("#stop-animation").click(function() {
  clearInterval(panInterval);
});

$("#start-animation").click(function() {
  panRight();
});

这里var panInterval是定时器id，每当我们调用setInterval时都会返回，可以用来清除间隔

赞(0）回复(0）举报 2023-10-17

我来回答

jquery 如何使用setInterval和clearInterval作为函数

1条答案

相关问题

热门标签

最新问答