익명 함수로 선언 된 요소의 이벤트를 제거하는 방법은 무엇입니까?

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 "엄격 모드"에서 불법이므로주의 : 당신은 함수 자체 내에서있어 동안에 만 다음

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); 
})(); 

편집 : 알니 타크의 수정 답변 한 - 그것은 이것보다 조금 더 간결입니다 하나.