傳遞給循環中的事件監聽器的值設置不起作用

這感覺就像是一個非常基本的問題，但我似乎無法找到答案。我有一個id爲「texture-1」，「texture-2」的可點擊的svg rects數組。textureInput數組保存這些rects的getElementById，它們在click上調用changeTexture（）函數。當點擊「紋理-1」時，我想要將「1」傳遞到changeTexture（）函數中。傳遞給循環中的事件監聽器的值設置不起作用

手動指定這些值的工作原理：例如，

textureInput[0].addEventListener('click', function(){changeTexture("0")}, false); 
    textureInput[1].addEventListener('click', function(){changeTexture("1")}, false);

但在一個循環做同樣的事情不會：

for (var i=0; i<maxTextures; i++){ 
    textureInput[i].addEventListener('click', function(){changeTexture(i)} 
};

是它傳遞的則電流值「I」，在活動時間 - 這是外循環未定義？

來源

2015-10-04 Michael Mullany

您需要創建一個閉包，以便創建i變量的新副本，否則將使用屬於for循環的那個。試試這個：

for (var i=0; i<maxTextures; i++){ 
    textureInput[i].addEventListener('click', (function(i) { 
    return function() { 
     changeTexture(i); 
    }; 
    })(i)); 
};

來源

2015-10-04 20:28:53

感謝丹尼爾 - 此代碼工作。 JavaScript中沒有任何東西可以將變量轉換爲靜態值？ –

@MichaelMullany不是我意識到的，這是你不得不這樣做的不幸。 –

使用閉包。一個簡單的方法是圍繞循環內的代碼包裝IIFE

for (var i=0; i<maxTextures; i++){ 
    (function(i){ 
     textureInput[i].addEventListener('click', function(){changeTexture(i);} 
    })(i); 
};

來源

2015-10-04 20:30:26 charlietfl

傳遞給循環中的事件監聽器的值設置不起作用

回答

相關問題