javascript - 停止for循环-jquery

Question

previous question

我正在查看这个问题，但我无法将其应用于我的问题。

这就是我想做的:

• 使用按钮启动循环遍历一组 html 表
• 使用另一个暂停按钮暂停动画
• 从中断处恢复动画

这与我正在做的事情类似:fiddle我当前的版本太麻烦，无法更新 fiddle ，但概念是相同的。我将像最右边的 slider 一样更改表格的内容。

代码如下:

$('#Animate1').click(function(e){  //controls the tabR animation (top small table)
    for(i = 1; i < 37; i++){  //number of frames in the animation
        (function(i){   
            setTimeout(function(){  
                $('#amount1').val(i);  //this changes the number corresponding to the slider position 
                updateTable2(i);  //this updates the contents of the html table   
                updateHighlightedCell();  //this controls the "highlighted cells"
                $('#hSlider').slider({  animate:true,value: i});}, 1000 );  //this animates the slider
        }(i));  
    }   
});

• 我也遇到了延迟问题。我试图将延迟纳入循环中，但似乎这只是开始延迟。我希望能够稍微控制帧速率。

• 我见过的许多示例都会停止无限循环，但我的是有限循环。我怎样才能停止这个循环并重新开始它？我的终极循环将包含 365 个“帧”，因此速度不会那么快。

如有任何帮助，我们将不胜感激。谢谢!

Answer 1

我在JSFiddle中做了一个简单的版本。 您可能感兴趣的内容，并希望提取对您有帮助的组件。还添加了大量评论来帮助理解这些片段。

我的方法背后的基本思想是让 setInterval() 充当 for 循环，并且每个循环都会检查 clearInterval() 是否已呼吁它。您将有一个全局计数器来跟踪位置。