2

我有一个数组,其中包含我页面中的一些元素。

现在我需要一个函数来遍历数组bold并向每个元素添加一个类。问题是一旦添加了类,就必须经过一段时间。然后bold必须删除并需要应用于下一个元素,从而产生“波浪”运动。

我试过这样做:

$.each(tdArr, function(i, v) {
  v.addClass("bold");
  setTimeout(function(){
    v.removeClass("bold");
  }, 900)
})

该代码的问题在于它一次bold添加到所有元素并在 900 毫秒后被删除,再次同时从所有元素中删除。

我该怎么做才能在单独的操作之间添加延迟?

4

4 回答 4

1

我认为您需要稍微不同地处理这个问题,因为setTimout立即返回它不会停止将下一个元素设置为粗体。

你可以用这样的方法来做到这一点:

function bold(i){
    if(i>0){
        $tdArr.eq(i-1).removeClass('bold');
    }
    if(i == $tdArr.length){
        return;
    }
    $tdArr.eq(i).addClass('bold')   

    setTimeout(function() { bold(i+1) },900);
}

然后调用它你只需要调用bold(0)

现场示例:http: //jsfiddle.net/rJGjZ/

于 2012-08-03T14:35:03.347 回答
0

试试这个:

$.each(tdArr, function(index, element) {
  var $elem = $(element);
  $elem.addClass("bold");
  setTimeout(function(){
    $elem.removeClass("bold");
  }, 900)
})

第二个参数不是 jQuery 元素,你需要转换他

于 2012-08-03T14:31:32.737 回答
0

在迭代数组时增加延迟,如果元素尚未包装,请确保将元素包装在 jQuery 中。如果它是 jQuery 元素的集合,则使用each迭代。

var delay = 900

$els.each(function(){
  var $this = $(this)
  setTimeout(function(){
    $els.removeClass('bold')
    $this.addClass('bold')
  }, delay+=900)
})

否则,我会for在 jQuery 中使用和包装元素。

for (var i=0, l=arr.length, d, prev; i<l; i++; d+=900) {
  prev = arr[i-1]
  setTimeout(function(){
    if (prev) $(prev).removeClass('bold')
    $(arr[i]).addClass('bold')
  }, d)
}
于 2012-08-03T14:36:53.980 回答
0

像这样的东西对你有用吗?

function Bold(element) {
  $(element).addClass("bold"); // we bold the current tdArr
  setTimeout(function(){
    var nextSibling = $(element).next("td") // (if the tdArr are "td" tags) we find the next td brother of this one
    if (!!nextSibling) Bold(nextSibling); // if there is a brother, repeat the function on him after 900ms
  }, 900)
}

Bold(myfirsttd);
于 2012-08-03T14:37:58.783 回答