イベントレスポンス関数にパラメータを渡す4つの方法まとめ_JavaScriptスキル

イベントハンドラーにパラメーターを渡すにはどうすればよいですか?初めて Javascript に触れたとき、クロージャについて深く理解していなかったので、この問題によく苦労しました。

次のようなディスカッション グループでこの問題によく遭遇します

コードをコピー コードは次のとおりです:

クリックしてください

パラメータ v1 と v2 をハンドラーに渡すにはどうすればよいですか?デフォルトのイベント オブジェクトは、ハンドラーの最初のパラメーターとして渡されます。リンクをクリックすると、最初にポップアップ表示されるのはイベント オブジェクトで、2 番目のオブジェクトは未定義です。
オプション 1、予約されていないイベント オブジェクトは最初のパラメーターとして渡されます

コードをコピーします コードは次のとおりです。

関数ハンドラー(arg1,arg2){
alert(arg1);
alert(arg2);
}
E.on(document.getElementById('aa) '),' click',function(){
handler(arg1,arg2);
});

オプション 2、イベント オブジェクトを最初のパラメータとして保持します

コードをコピーします コードは次のとおりです:

function handler(e,arg1,arg2){
アラート(e);
アラート(arg1);
アラート(arg2);
}
E.on(document.getElementById('aa'),'click',function(e) {
handler(e ,arg1,arg2);
});

オプション 3、getCallback を Function.prototype に追加し、イベント オブジェクト

を保持しない

コードをコピーします コードは次のとおりです:

Function.prototype.getCallback = function(){
var _this = this, args = 引数;
return function (e) {
return _this.apply(this || window, args);
};
}
E.on(document .getElementById('aa'),'click',handler .getCallback(v1,v2));

オプション 4、getCallback を Function.prototype に追加し、イベント オブジェクトを保持して次のように渡します。最初のパラメータ

コードをコピー コードは次のとおりです。

Function.prototype.getCallback = function(){
var _this = this, args = [];
for(var i=0,l=arguments.length;i args[i 1] = 引数[i];
}
return function(e) {
args[0] = e;
return _this.apply(this || window, args);
};
}
E.on(document.getElementById('aa'), 'click',handler.getCallback(v1,v2));