停止/暂停此操作并重新启动它

Question

$(function(){
    $('.fadein img:gt()').hide();
    setInterval(function(){
      $('.fadein :first-child').fadeOut()
         .next('img').fadeIn()
         .end().appendTo('.fadein');}, 
      6800);
});

我希望只需单击一个按钮即可停止此按钮，然后单击相同的按钮启动它。任何想法？

Answer 1

试试这个：

$(function(){
    $('.fadein img:gt()').hide();
    var active = true;
    setInterval(function(){
      if(active) {
        $('.fadein :first-child').fadeOut()
           .next('img').fadeIn()
           .end().appendTo('.fadein');
      }
    }, 6800);

    $('#buttonId').click(function(){ active = !active; });
});

感谢Rikonator，这里有更好的答案：

$(function(){
    $('.fadein img:gt()').hide();
    var active = true;
    var interval = setInterval(intervalFunction, 6800);

    $('#buttonId').click(function(){ 
       if(!active) 
          interval = setInterval(intervalFunction, 6800)
       else
          clearInterval(interval);
    });

    function intervalFunction(){
        $('.fadein :first-child').fadeOut()
           .next('img').fadeIn()
           .end().appendTo('.fadein');
    }
});