Javascript eventhandler：パラメータを持つハンドラの実行に問題があります

Question

この問題が発生しました：

パラメータを必要とするイベントハンドラを定義しました。

var handler = function(p1, p2){ 
    //some code 
} 

次に、イベントハンドラを関数内のオブジェクトに追加します。

function foo(p1, p2){ 
    //Some code 
    obj.addEventListener('click', handler(p1, p2), false) 
} 

上記のコードは正しくありません。イベントに耳を傾けません。代わりに、即座に機能を実行します。これを修正するには、handler(p1, p2)を消去し、代わりにfunction(){ handler(p1, p2) }を挿入してください。しかし、問題は、後者の解決策では不可能な、イベントリスナーを削除する別の機能があることです。

function koo(){ 
    //Some code 
    obj.removeEventListener('click', handler, false) 
} 

これを修正するにはどうすればよいですか？

function foo(){ 
    //Some code 
    obj.addEventListener('click', handler, false) 
} 

それを呼び出すのではなく、関数を渡す：

Answer 1

私はあなたが閉鎖を作成する必要がありますと思う：

var createHandler = function(p1, p2){ 
    return function (event) { 
     //some code that uses p1 and p2 
    }; 
}; 

var handler; 

...と、まだP1およびP2へのアクセスを持ちながら、今あなたは、そのようにハンドラを割り当てることができます。

function foo(p1, p2){ 
    handler = createHandler(p1, p2); 
    //Some code 
    obj.addEventListener('click', handler, false); 
} 

function koo(){ 
    //Some code 
    obj.removeEventListener('click', handler, false); 
    handler = null; 
} 

handlerはグローバル変数になりました。

---

更新：私はちょうどあなたのケースで、これは次のようにcreateHandlerとfooを併合することによって単純化することができることを実現：

var handler; // we need this to be accessible both to foo and koo 

function foo(p1, p2){ 
    handler = function(event) { 
     // some code that uses p1 and p2 
    }; 
    //Some code 
    obj.addEventListener('click', handler, false); 
} 

function koo(){ 
    //Some code 
    obj.removeEventListener('click', handler, false); 
    handler = null; 
} 

Answer 2

はそれだけでこれではありません。

Answer 3

私はあなたが引数を渡したいとは思わない - それはコールバックであり、それらの変数が何であるか決して分からないからです。

あなたが行うことができます...あなたはそれに引数を持ちたい理由

(function() { 

    var p1 = 'a', 
     p2 = 'b', 
     obj = document.getElementById('my-object'); 

    var handleClick = function(event) { 
     // Access to p1 and p2 
     // Access to `event` object containing info about the event 
    } 

    obj.addEventListener('click', handleClick, false); 

    // If you want to remove it 
    obj.removeEventListener('click', handleClick, false); 

})(); 

は、私が聞いてもいいですか？あなたはそれを非クリックトリガーのやり方から呼び出すつもりですか？