0

重複の可能性：
forループにクリックハンドラーを割り当てます

私は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>

ボタンクリック出力

4

1 に答える 1

3

明らかな問題はありません。ただし、関数内で使用carします。どちらもアウターとに依存し、操作されます。クロージャを使用して、この参照を解除する必要があります。ionclickcari

    el.onclick = (function(carname,index){
        return function() { 
            showMe(carname,index);
        };
    })(car,i);
于 2012-08-06T10:27:15.847 に答える