Question

CSS

.item {
  display: none;
}

HTML 的

<div>
  <div class="item">machin</div>
  <div class="item">chose</div>
  <div class="item">chouette</div>
  <div class="item">prout</div>
</div>

我正在使用jQuery，我想让每个.item出现在一个随机的小计时器之后：

的javascript

$('.item').each(function () {
  itm = $(this);
  setTimeout(function () {
    itm.fadeIn(1000);
  }, Math.floor(Math.random() * 1000));
})

此处itm将始终包含最后一项，因为在所有作业后评估该功能我不能使用setTimeout()的第3个参数，因为它不适用于IE 出于安全原因，建议不要将setTimeout()与 eval 方法一起使用。

那么如何通过setTimeout()访问我的对象？

修改

我知道这个问题已经发布了。
但我认为它与each()背景稍有针对性现在有人完全改变了我的问题的标题，原来是像'setTimeout（） - jQuery.each（）这个对象参数'

Answer 1

不要使用setTimeout，使用jQuery自己的工具。

$('.item').each(function () {
   $(this).delay(Math.random() * 1000).fadeIn();
})

http://api.jquery.com/delay/

工作示例：http://jsfiddle.net/qENhd/

Answer 2

创建/使用closure：

$('.item').each(function () {
  var that = this;

  setTimeout(function () {
    $(that).fadeIn(1000);
  }, Math.floor(Math.random() * 1000));
})

http://jibbering.com/faq/notes/closures/

https://developer.mozilla.org/en/JavaScript/Guide/Closures

Answer 3

在setTimeout执行each循环完成执行之前，它不会等待。同样在setTimeout函数this内也不会引用DOM元素。

尝试这样的事情。

function fadeItem(item){
   item.fadeIn(1000);
}

$('.item').each(function () {
  var $item = $(this);
  setTimeout(function () {
    fadeItem($item);
  }, Math.floor(Math.random() * 1000));
});

您也可以尝试这样的事情。

var $items = $('.item'), count = 0;

function fadeItem(item){
   item.fadeIn(1000);
    if(count < $items.length){
       setTimeout(function(){
            fadeItem($items.eq(count++));
       }, Math.floor(Math.random() * 1000));
    }
}
setTimeout(function(){
    fadeItem($items.eq(count++));
}, Math.floor(Math.random() * 1000));

Answer 4

您需要将this存储在单独的变量中：

$('.item').each(function () {
  var me = $(this);
  setTimeout(function () {
    me.fadeIn(1000);
  }, Math.floor(Math.random() * 1000));
})

Answer 5

这里的诀窍是将this保存到可以在setTimeout回调中安全评估的本地

$('.item').each(function () {
  var self = this;
  setTimeout(function () {
    $(self).fadeIn(1000);
  }, Math.floor(Math.random() * 1000));
});

Answer 6

试试这个：

$('.item').each(function () {
 var myVar = $(this);
setTimeout(function () {
myVar.fadeIn(1000);
}, Math.floor(Math.random() * 1000));
})

Answer 7

试试这个：

    $('.item').each(function () {
        var elm = this;
      setTimeout(function () {
        $(elm).fadeIn(1000);
      }, Math.floor(Math.random() * 1000));
    })

我无法解释它为何有效，但我认为这是对你的setTimeout中另一个“this”的引用。

http://jsfiddle.net/Pdrfz/

Answer 8

试试这个：

 $('.item').each(function () {
    var item =$(this);
    setTimeout(function () {
            item.fadeIn(1000);
        },
        Math.floor(Math.random() * 1000));
   });

如何将'this'传递给setTimeout回调

8 个答案: