2012/08/26(日)JavaScriptの無名function内にバインドされる変数のスコープがC#と違う

はてブ数 2012/08/26 17:38 プログラミング::JavaScriptつーさ

ボタンをスクリプトでたくさん作って、それぞれの clickイベントの function を作るときに、
そのfunctionの外側で宣言された変数がどうbindしたらいいのか。

<div id="test"></div>

<script>
for (var i = 0; i < 10; i++) {
  var input = document.createElement('input');
  var j = i;
  input.type = 'button';
  input.value = input.id = 'button_' + i;
  input.addEventListener('click', function() { alert(j); });
  document.getElementById('test').appendChild(input);
}
</script>

やりたいことはわかってもらえると思う?
でも、どのボタンを押しても表示されるのは9。これじゃあだめ。

というか、一瞬自分の書いたスクリプトに馬鹿にされてる気がしてきた。9的な意味で。

どーやるんだろう。

続きを読む