Question

我有一个需要$(this)解析它的函数。它位于each循环内。这按预期工作。当我与$(this)

一起使用时，我需要访问setTimeout()时出现此问题

为了简化和展示我的问题，我已经把一个基本的小提琴放在一起。您会注意到文本未输出。

$("li").each(function(i) {
    /* below example outputs value if i only */
    setTimeout(function() {
        alertThis($(this).text() + i);
    }, 1000 * i);

    /* below example works as you'd expect outputting the text and value of i */
    alertThis($(this).text() + i + ' outside of timeout');
});

function alertThis(text)
{
     alert(text);   
}

Answer 1

如果范围发生变化，您需要捕获this：

$("li").each(function(i) {
  var target = $(this);

  setTimeout(function() {
    alertThis(target.text() + i);
  }, 1000 * i);

  alertThis(target.text() + i + ' outside of timeout');
});

Answer 2

那是因为this在setTimeout()内失去了背景。简而言之，this引用setTimeout()内部的全局对象，因为你已经改变了范围。处理此问题的典型方法是将this的上下文存储在变量中（通常为that）：

var that = $(this);

Answer 3

传递给each的函数接收第二个参数，即dom元素本身。你可以简单地使用它：

$("li").each(function(i, el) {

    setTimeout(function() {
        alertThis($(el).text() + i);
    }, 1000 * i);

    alertThis($(el).text() + i + ' outside of timeout');
});

http://jsfiddle.net/6e937r1b/4/

解析$（this）以在setTimeout中运行

3 个答案: