0

document.createElementコードにダイナミクスがありました。addEventListener - onclick作成したすべてに追加したい<div>。私が直面した問題は、すべての onclick イベントが配列から最後の結果を返したことです。

var table = [
                [ "H", "Hydrogen", "1.00794", 1, 1 ],
                [ "He", "Helium", "4.002602", 18, 1 ],
                [ "Li", "Lithium", "6.941", 1, 2 ],
                [ "Be", "Beryllium", "9.012182", 2, 2 ],
            ]; 

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

        var item = table[ i ];


        var element = document.createElement( 'div' );
        element.setAttribute("id", "element_"+i);
        element.className = 'element';
        element.style.backgroundColor = 'rgba(0,127,127,' + ( Math.random() * 0.5 + 0.25 ) + ')';
        element.style.cursor = 'pointer';
        element.addEventListener("click", function(e){ alert(item[0]); });
}

任意の div をクリックすると、配列の最後の結果である「Be」のみが警告されます。イベント ハンドラを特定のそれぞれに追加するにはどうすればよいですか<div>。試してみましbindたが、クリックしてもアラートボックスが表示されず、エラーメッセージも表示されません。

4

1 に答える 1