Javascript 函数在几个循环后中断

我试图找出我的函数在几个循环后被破坏的原因

当我运行我的网页时，它工作正常，但当我在浏览器中打开另一个选项卡，让功能运行，让它运行几个循环，然后返回到该网页时，该功能会刷新几次，并且在den后，背景色淡出开始闪烁，但设置时间为2000ms。。有没有办法解决这个问题

我尝试这样做：清除间隔并在每次循环后再次运行函数，但它做的是相同的事情

以下是一个示例：

• 打开链接，然后让功能完全加载
• 打开另一个选项卡
• 让函数循环几次（设置为5秒）
• 回到函数

$（文档）.ready（函数（）{
var mixit=$（“#容器”）.mixItUp({
负载：{
排序：“随机”
},
布局：{
容器类：“列表”，
显示：“块”
}
});
函数循环（）{
var-arr=[]；
i=0；
$（'.mix'）。每个（函数（）{
arr[i++]=$（this.data（'myorder'）；
});
mixit.mixItUp（'sort'，'random'）；
mixit.on（'mixEnd'，函数（e，状态）{
var arr2=[]；
i2=0；
$（'.mix'）。每个（函数（）{
arr2[i2++]=$（this）.data（'myorder'）；
});
对于（i=0；i有动画选项
queue
（默认值：
true
），指示是否将动画放置在效果队列中。要立即启动动画，应将其设置为
false
。计时器不完美（尤其是在切换选项卡期间）。此处，彩色动画不需要效果队列。它应立即启动。禁用队列（
queue:false
）可修复动画：

$(this).css({
    backgroundColor: options.start
}).animate({
    backgroundColor: options.end
}, {
    duration: options.time,
    queue: false
});


动画中断的主要原因是
mixEnd
事件处理程序的渐进注册。函数
mixit.on（'mixEnd'，函数（e，state）{…}）
不应在
循环
函数内调用，因为在每次调用过程中，它会注册一个新的处理程序函数。因此，偶数处理程序调用的数量会随着时间的推移而逐渐增加。这导致动画效果的队列变大

因此，如果回调只注册一次就没有问题了：
@Libor Zahrádka您的上一个代码被破坏了，末尾缺少了几行：
返回这个；}；
@Libor Zahrádka还有一个问题。回调注册应该在循环函数之前只注册一次。这是主要的错误。我更新了答案。