javascript - Javascript イテレーションの問題

Question

私は次のコードを繰り返し処理しようとしていますが、何らかの理由でそれを繰り返し処理するたびに、イベント ハンドラーが起動します。

nmbr = 1;           
 x1 =   document.getElementsByClassName('fp')[0]  ;  
        slowSkrol = document.createElement('button'); 
        slowSkrol.className = 'mods'; 
        slowSkrol.value= nmbr; 
            x1.appendChild(slowSkrol);  
        slowSkrol.addEventListener('click', whenclicked(nmbr),false);
function whenclicked(vv){
alert(vv);
}

Answer 1

関数自体をイベントにバインドするのではなく、関数を呼び出して、その戻り値をイベントにバインドしています。次のように置き換えますwhenclicked(nmbr)。

function(){ whenclicked(nmbr); }

最新のブラウザーでは、 bindも使用できます。

whenclicked.bind(null, nmbr);

Answer 2

変化する：

slowSkrol.addEventListener('click', whenclicked(nmbr),false);

に

slowSkrol.addEventListener('click', function() {
    whenclicked(nmbr); 
},false);

Answer 3

本当に別の答えを追加するべきではありません。しかし、これを行う正しい方法ですべての引数を取得すると、そのthisようになります。

slowSkrol.addEventListener('click', function( event ) {
   whenclicked.apply(this, [event, nmbr]);
}, false);

その後、このように使用できます。

function whenclicked( event, nmbr ){
   alert(this, event, nmbr);
   // this = slowSkrol
}