Jquery .each延迟问题[重复]答案

【问题标题】：Jquery .each delay issue [duplicate]Jquery .each延迟问题[重复]
【发布时间】：2016-05-19 03:56:34
【问题描述】：

我正在尝试用 JavaScript 做一些事情并尝试一些问题。

这是我的 Html 代码：

<div class="views-row"></div>
<div class="views-row"></div>
<div class="views-row"></div>
<div class="views-row"></div>

在 JavaScript 中，我尝试延迟向每个 div 添加一个类，但我无法做到这一点。这是我的JS

$('.views-row').each(function(){
            $(this).addClass("test").delay(1000);
});

不知道怎么回事，有人知道吗？

感谢您的帮助；）

【问题讨论】：

@Shree 我不这么认为。这是不同的问题，这是不同的。

标签： javascript jquery html each delay

【解决方案1】：

jQuery的delay()主要用于动画，使用setTimeout代替

$('.views-row').each(function(index, elem){
    setTimeout(function() {
        $(elem).addClass("test");
    }, index * 1000);
});

FIDDLE

【讨论】：

【解决方案2】：

将setTimeout 与.each 的index 参数一起使用。 .bind() 会将 this 值传递给目标函数。

试试这个：

$('.views-row').each(function(index) {
  setTimeout(function() {
    $(this).addClass("test");
  }.bind(this), index * 1000);
});

.test {
  background: green;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div class="views-row">Test</div>
<div class="views-row">Test</div>
<div class="views-row">Test</div>
<div class="views-row">Test</div>

Fiddle here

【讨论】：