Javascript 每个函数都没有使用jQuery处理setTimeout属性？

我有四个盒子，我想从左边一个一个地来。但这一切都在一起。我如何解决这个问题

我尝试的是：-

$（'.box'）。每个（函数（）{
var$this=$（this）；
setTimeout（函数（）{
$this.addClass（'unbox'）
},1000 );
});
.box{高度：100px；宽度：100px；背景：黑色；浮点：左侧；边距：10px；变换：translateX（-500px）；变换：全部0.45s；}
.unbox{transform:translateX（0px）；}
为每个框逐步延长超时时间。将索引作为第一个参数传递给其回调函数，您可以根据该回调函数计算超时延迟：


$（'.box'）。每个（函数（i）{
var$this=$（this）；
setTimeout（函数（）{
$this.addClass（'unbox'）
}（i+1）*1000）；
});
.box{高度：100px；宽度：100px；背景：黑色；浮点：左侧；边距：10px；变换：translateX（-500px）；变换：全部0.45s；}
.unbox{transform:translateX（0px）；}
为每个框逐步延长超时时间。将索引作为第一个参数传递给其回调函数，您可以根据该回调函数计算超时延迟：


$（'.box'）。每个（函数（i）{
var$this=$（this）；
setTimeout（函数（）{
$this.addClass（'unbox'）
}（i+1）*1000）；
});
.box{高度：100px；宽度：100px；背景：黑色；浮点：左侧；边距：10px；变换：translateX（-500px）；变换：全部0.45s；}
.unbox{transform:translateX（0px）；}
我建议您查看JS动画库，如GSAP（），以获得高级动画

但为了快速修复，您可以应用以下JS逻辑：-

$('.box').each(function(index){
    var $this = $(this);
    setTimeout(function(){
        $this.addClass('unbox')
    }, index * 1000);
});

我建议您查看JS动画库，如GSAP（），以获得高级动画

但为了快速修复，您可以应用以下JS逻辑：-

$('.box').each(function(index){
    var $this = $(this);
    setTimeout(function(){
        $this.addClass('unbox')
    }, index * 1000);
});

在脚本中，foreach不会等待超时执行，您有4个超时，开始时相差几毫秒。您可以通过多种方式让每个循环同步，但我认为有一种非常简单的解决方案可以解决您的问题，而不会使脚本过于复杂

只需使用一个索引，并在每个周期上在设置的超时时间中添加一点时间：设置超时时间并没有固定1000毫秒的时间，而是1000*i（索引在每个周期上都会变化）


i=0；
$（'.box'）。每个（函数（）{
i++；
var$this=$（this）；
setTimeout（函数（）{
$this.addClass（'unbox'）
}，i*1000）；
});
.box{高度：100px；宽度：100px；背景：黑色；浮点：左侧；边距：10px；变换：translateX（-500px）；变换：全部0.45s；}
.unbox{transform:translateX（0px）；}
在您的脚本中，foreach不会等待超时执行，您有4个超时，以几毫秒的差异开始。您可以通过多种方式让每个循环同步，但我认为有一种非常简单的解决方案可以解决您的问题，而不会使脚本过于复杂

只需使用一个索引，并在每个周期上在设置的超时时间中添加一点时间：设置超时时间并没有固定1000毫秒的时间，而是1000*i（索引在每个周期上都会变化）


i=0；
$（'.box'）。每个（函数（）{
i++；
var$this=$（this）；
setTimeout（函数（）{
$this.addClass（'unbox'）
}，i*1000）；
});
.box{高度：100px；宽度：100px；背景：黑色；浮点：左侧；边距：10px；变换：translateX（-500px）；变换：全部0.45s；}
.unbox{transform:translateX（0px）；}

这个问题是因为当每个函数都是同步的时，setTimeout是异步的。看看这篇文章，了解这两种行为。伙计们，错误很简单。你没有注意到数字超时总是一样的吗？这个问题是因为当每个函数都是同步的时候，setTimeout是异步的。看看这篇文章，了解这两种行为。伙计们，错误很简单。你没有注意到数字超时总是一样的吗？