在onclick事件處理程序循環中設置當前元素

我在循環多個元素，我也想分配一個onclick事件處理程序。在onclick事件處理程序循環中設置當前元素

問題是，發送到goTo函數（事件處理程序）的元素始終是循環中的最後一個元素。我究竟做錯了什麼？

var navLinks = document.getElementsByClassName('navigation'); 

    for (var i = 0; i < navLinks.length; i++) { 
     var navLink = navLinks[i]; 
     navLink.onclick = function() { goTo.call(navLink); } 
    }

來源

2014-01-12 Wesley

您應該添加關閉，像這樣：

var navLinks = document.getElementsByClassName('navigation'); 

for (var i = 0; i < navLinks.length; i++) { 
    var navLink = navLinks[i]; 
    (function(navLink){ //This line does the magic 
     navLink.onclick = function() { goTo.call(navLink); } 
    })(navLink); //This calls the created function  
}

這樣，內navLink將每個循環週期中唯一的，所以它不會被覆蓋（這就是爲什麼它仍然與在以前的代碼最新值）

乾杯

來源

2014-01-12 23:44:23

我知道這是舊的，但解決方案是*不*要「添加閉包」。該解決方案因爲一個函數被*執行*而起作用，從而創建一個新的範圍。函數是否是閉包是無關緊要的。 –

我在做什麼錯？

有關說明，請參閱JavaScript closure inside loops – simple practical example。

裏面的事件處理程序，您可以通過this訪問元素本身（這工作，如果你還用addEventListener，而不是處理程序綁定）：

navLink.onclick = function() { goTo.call(this); }

並假設goTo是一個功能，可以縮短代碼到

navLink.onclick = goTo;

你的情況。

來源

2018-01-16 00:14:13

在onclick事件處理程序循環中設置當前元素

回答

相關問題