問題的JavaScript功能分配給按鈕點擊

可能重複：
Assign click handlers in for loop 問題的JavaScript功能分配給按鈕點擊

我在javascript有點幼稚。我有這個JavaScript代碼，應該按鈕點擊運行。按鈕在循環中動態生成。我期望的是在每次點擊按鈕時收到不同的變量。但是我收到的總是數組中的最後一個變量。請參閱下面的代碼。有人在這裏看到明顯的錯誤嗎？

<!doctype html> 
<html> 
<head>  
<script type="text/javascript"> 

var myCars=["Saab","Volvo","BMW"]; 

    function loadCars() { 
var carList = document.getElementById('mydiv'); 

for(var i=0;i < myCars.length ; i++){ 

//Append button 
     var el = document.createElement("button"); 
     var car = myCars[i]; 
     el.name = "view_car"; 
     el.id = "view_car"; 
     el.value = "View car"; 
     el.type = "button"; 
     el.title = "View car "+i; 
     el.innerHTML = "View car "+car; 
     el.onclick = function() { 
      showMe(car,i); 
     }; 

    carList.appendChild(el); 
} 

} 

function showMe(carName,index){ 

    alert("Selected car="+carName +" , index="+index); 
} 

    </script> 

</head> 

<body onload="loadCars()"> 

Cars will be loaded here 
<div id="mydiv" class="carlist"></div> 

</body> 
</html>

Button click output

來源

2012-08-06 Tushar

問題是JavaScript沒有保存值的汽車，我爲每個動態生成的按鈕 – thecodejack 2012-08-06 10:27:17

沒有什麼明顯的錯誤。但是，您在onclick函數中使用car和i。兩者都取決於外部car和i並且被操縱。你必須通過使用閉包來打破這個參考：

el.onclick = (function(carname,index){ 
     return function() { 
      showMe(carname,index); 
     }; 
    })(car,i);

來源

2012-08-06 10:27:15 Zeta

問題的JavaScript功能分配給按鈕點擊

回答

相關問題