匿名関数によって宣言された要素のイベントを削除するにはどうすればよいですか？

Question

サンプルコード：

element.addEventListener('click',function() { 
    this.style.backgroundColor = '#cc0000' 
    //after element was clicked once what to do here to remove this event ? 
},false) 

そして、それを行うには、それが直接私がコメントを入れる機能で可能ですか？

Answer 1

addEventListener()でイベントを追加する場合は、その機能を参照して後で削除する必要があります。

element.addEventListener('click', function() { 
    this.style.backgroundColor = '#cc0000'; 
    this.removeEventListener('click', arguments.callee); 
}, false); 

が、これはES5「strictモード」では合法ではないことに注意してください：あなたは関数自体の中にいる間だけ、その後

arguments.calleeでのみ可能だ無名関数で

、と。

したがって、ちょうどあなたのコールバックの名前を与えると、そのremoveEventLister()への呼び出しで使用する方がよいでしょう：

element.addEventListener('click', function cb() { 
    this.style.backgroundColor = '#cc0000'; 
    this.removeEventListener('click', cb); 
}, false); 

デモhttp://jsfiddle.net/alnitak/RsaVE/

もう本当に匿名ない

Answer 2

で、しかし、ここが最適です私は（クロージャを使用して）を思い付くことができます。

(function(){ 
    var handler = function(){ 
    this.style.backgroundColor = '#cc0000' 
    element.removeEventListener('click', handler, false); 
    }; 
    element.addEventListener('click', handler, false); 
})(); 

編集：オリオン座ゼータ星の改定答えのための1 - それはこれよりもう少し簡潔です1。