Javascript setTimeout（）语法？

我无法使以下设置超时正常工作：

$('a').click(function(){
    if( last ) {
        if( ($(this).attr('id') == last.attr('id')) ) {
            setTimeout( function(){ 
                $(this).parent().parent().css('visibility','hidden'); 
            },500); 
            setTimeout( function(){ 
                last.parent().parent().css('visibility','hidden'); 
            },500); 
            found++; 
        } 
        if (found == 3) { 
            alert('You won a sticker!'); 
            window.location.href = "#play2"; 
            location.reload(); //resets found to 0 
        } last = null; 
    } 
    else { 
        last = $(this) 
    } 
});

---

setTimeout中的函数可以正常工作，因此不会出现问题。我想知道我的语法是否有问题。但是，我没有发现它有任何问题。

在第一个

setTimeout

中，this===window

。您可能希望创建一个闭包

var that = this
setTimeout( function(){
    $(that).parent().parent().css('visibility','hidden');
 },500);

---

在第一个

设置超时

中，此===窗口

。您可能希望创建一个闭包

var that = this
setTimeout( function(){
    $(that).parent().parent().css('visibility','hidden');
 },500);

---

setTimeout（）

语法没有问题。问题在于，在函数中，

此

的设置取决于该函数的调用方式，当您通过

setTimeout（）

调用函数时，

此

不再是单击事件中的DOM元素。您可以在传递给

setTimeout（）

的函数之外保留对它的引用，这也可以节省您选择

$（this）

两次（如果您在函数和

if

语句中都使用保存的引用）。我认为第二个

setTimeout（）

没有任何问题，因为它已经使用了函数外部的引用

    var $this = $(this);
    if( ($this.attr('id') == last.attr('id')) ) {
        setTimeout( function(){ 
            $this.parent().parent().css('visibility','hidden'); 
        },500); 
        setTimeout( function(){ 
            last.parent().parent().css('visibility','hidden'); 
        },500); 
        found++; 
    }

或者，如果使用

.hide（）

，则可以使用jQuery的动画队列来

.delay（）

而不是

设置超时（）

：

---

使代码更整洁，但是

.hide（）

将设置

显示：无

而不是

可见性：隐藏

，我承认这可能不是您想要的（您不能将

.delay（）

与

.css（）

一起使用，因为

.css（）

不是动画方法）.

这不是

setTimeout（）

语法的问题。问题在于，在函数中，

此

的设置取决于该函数的调用方式，当您通过

setTimeout（）

调用函数时，

此

不再是单击事件中的DOM元素。您可以在传递给

setTimeout（）

的函数之外保留对它的引用，这也可以节省您选择

$（this）

两次（如果您在函数和

if

语句中都使用保存的引用）。我认为第二个

setTimeout（）

没有任何问题，因为它已经使用了函数外部的引用

    var $this = $(this);
    if( ($this.attr('id') == last.attr('id')) ) {
        setTimeout( function(){ 
            $this.parent().parent().css('visibility','hidden'); 
        },500); 
        setTimeout( function(){ 
            last.parent().parent().css('visibility','hidden'); 
        },500); 
        found++; 
    }

或者，如果使用

.hide（）

，则可以使用jQuery的动画队列来

.delay（）

而不是

设置超时（）

：

---

使代码更整洁，但是

.hide（）

将设置

显示：无

而不是

可见性：隐藏

，我承认这可能不是您想要的（您不能将

.delay（）

与

.css（）

一起使用，因为

.css（）

不是动画方法）。

setTimeout

回调中的

this

值是全局

窗口

对象。关键的一点是函数中

这个
的值是上下文的（也就是说，它取决于调用函数的方式）

您需要从外部范围保存对
this
值的引用，以便在内部范围内使用它：

if ($(this).attr('id') == last.attr('id')) {
    var that = $(this);
    setTimeout( function() { 
        that.parent().parent().css('visibility','hidden'); 
    },500); 
    // ...
}

click
处理程序中的
this
值是对已单击元素的引用。
setTimeout
回调中的
this
值是全局
窗口
对象。关键的一点是函数中
这个
的值是上下文的（也就是说，它取决于调用函数的方式）

您需要从外部范围保存对
this
值的引用，以便在内部范围内使用它：

if ($(this).attr('id') == last.attr('id')) {
    var that = $(this);
    setTimeout( function() { 
        that.parent().parent().css('visibility','hidden'); 
    },500); 
    // ...
}

使用jQuery习惯用法：

setTimeout(jQuery.proxy(function(){
  $(this).parent().parent().css('visibility','hidden');
}, this), 500);

标准JavaScript：

setTimeout(function(){
  $(this).parent().parent().css('visibility','hidden');
}.bind(this), 500);

使用jQuery习惯用法：

setTimeout(jQuery.proxy(function(){
  $(this).parent().parent().css('visibility','hidden');
}, this), 500);

标准JavaScript：

setTimeout(function(){
  $(this).parent().parent().css('visibility','hidden');
}.bind(this), 500);