jQuery將$（this）傳入setTimeout fn - 我錯過了什麼？

Question

這一定很容易，但我看不到它。需要另一個（更聰明）的眼睛。

這工作：

$('#topmenu li').hover(
    function(){ 
     $this = $(this); 
     alert($this.attr('id')); 
    } 
); 

而且這個工程：

$('#topmenu li').hover(
    function(){ 
     $this = $(this); 
     setTimeout(function($this){ 
      alert('hello'); 
     },800); 
    } 
); 

但是，這並不工作：

$('#topmenu li').hover(
    function(){ 
     $this = $(this); 
     setTimeout(function($this){ 
      alert($this.attr('id')); 
     },800); 
    } 
); 

我在想什麼？

Answer 1

問題在於向該函數添加參數會在其私有範圍內創建一個局部變量，這可能會在其中一個父範圍中隱藏具有相同名稱的其他變量。

如果沒有一個參數：

var $this = 1; 
function f() { 
    return $this; 
} 
f(); // 1 

隨着參數：

var $this = 1; 
function f($this) { 
    return $this; 
} 
f(); // undefined 
f(2); // 2 
$this; // 1 

在第一情況下，存在在該函數的範圍沒有$this變量，因此，全局定義的返回$this可變。在第二種情況下，f()返回undefined，因爲$this本地存在，但默認設置爲undefined，而f(2)返回2，因爲本地$this設置爲2。

關於你自己的情況，$this.attr('id')會崩潰，因爲$this沒有定義。您必須將setTimeout(function($this){替換爲setTimeout(function(){才能檢索外部變量。

Answer 2

刪除$this從setTimeout callback function

$('#topmenu li').hover(
    function(){ 
     var $this = $(this); 
     setTimeout(function(){ 
      alert($this.attr('id')); 
     },800); 
    } 
); 

Fiddle Demo

Answer 3

你並不需要通過$this如放慢參數在setTimeout功能

$('#topmenu li').hover(
    function(){ 
     $this = $(this); 
     setTimeout(function(){ 
      alert($this.attr('id')); 
     },800); 
    } 
); 

DEMO