javascript - 使用 setInterval() 刷新图像

Question

我有 4 个 div，每个 div 包含一个图像项目和一个包含 4 个 div-id 的选择列表。我想通过每 2 秒更改每个图像的源来同时刷新图像。

我对每个图像使用 setInterval() ，问题是我必须同时停止所有计时器。

我应该为每个 div/img 创建一个计时器变量吗？

$(.div-id option:selected).each(function(){
   var timer = setInterval(function(){
       $(.div-id img).attr("src", "new-source-path");
   },2000);
});

如何立即停止所有事件计时器而不停止每个计时器 ID？

是否有任何解决方案与 setTimeout() 或任何插件来做到这一点？

Answer 1

我会选择一个循环遍历所有图像的计时器。然后，当不再需要计时器时，我可以丢弃单个计时器。

var timer = setInterval(swapImages, 2000);
function swapImages() {
    $(.div-id option:selected).each(function(){
        $(.div-id img).attr("src", "new-source-path"); 
    });
}

// some time later
clearInterval(timer);

PS。我假设您的代码是一些伪代码，所以我复制了您的命名