java腳本上一次迭代設置所有迭代的值

Question

var myElements = document.getElementsByName('bb1'); 
    for (var i = 0; i < myElements.length; i++) { 
     var curValue = myElements[i].getAttribute('innerId') 
     myElements[i].addEventListener('mouseover', function() { 
      alert('Hello i am : ' + curValue); 
     }, false); 
    } 

當鼠標懸停在每個元素上，而不是顯示curValue的不同值時，會顯示一個常量值（最後一個迭代值）。

我在這裏做錯了什麼？

Answer 1

JavaScript內部沒有像for這樣的塊內部的不同作用域，所以當你的mouseover事件被觸發時，它會提醒當前在上次迭代中設置的變量值。

您可以在回調函數中使用this來獲取觸發事件的對象的屬性。

var myElements = document.getElementsByName('bb1'); 
for (var i = 0; i < myElements.length; i++) { 
    myElements[i].addEventListener('mouseover', function() { 
     alert('Hello i am : ' + this.getAttribute('innerId')); 
    }, false); 
} 

Answer 2

一般這裏的問題是關閉在Javascript。使用未在回調函數中定義的變量（此例中爲curValue）時會發生這種情況。

我推薦閱讀JS關閉的答案here。