2013-07-12 4 views
1

input 요소에 대한 이벤트를 제거하려고합니다.여러 요소에서 이벤트를 제거하는 방법

나는 다음과 같은

//add mouse up event on all element under mainDiv 
addEvent('mainDiv', 'onmouseup', mouseUpFun); 

//search all the input elements and remove the mouse up event 
inputs = document.getElementsByTagName('input'); 
    for(var i; i < inputs.length; i++){ 
     var input = inputs[i]; 
     input.removeEventListener('onmouseup'); 
    } 

코드 위의 방법으로 문제가 해결되지 여전히 onmouseup 이벤트를 첨부해야합니다.

누구든지이 문제에 대해 도움을 줄 수 있습니까? 고마워요!

+1

'addEvent'가 아닌 디버깅하기 어려운 비트입니다. –

+0

또한 확인하십시오 : http://stackoverflow.com/questions/803936/how-to-clear-remove-javascript-event-handler –

+1

'addEventListener()'이외의 다른 메소드가 있다면'addEvent() '함수를 사용한다면, 아마도 상응하는'removeEvent()'도 만들어야 할 것이다. – Teemu

답변

3

글쎄, 그 이유 중 하나는 루프가 실행되지 않을 수도 있다는 것입니다. 당신은 당신의 루프에서 i를 초기화해야합니다

for(var i = 0; i < inputs.length; i++){ 
    var input = inputs[i]; 
    input.removeEventListener('onmouseup'); 
} 

그렇지 않으면이 루프가 undefined의 초기 값을 갖는 인해 i으로 실행되지 않습니다.

removeEventListener으로 전화하면 예상대로 작동하지 않습니다. 또한 사용했던 리스너/핸들러에 대한 참조를 제공해야합니다.

removeEventListener의 올바른 사용법은 here을 참조하십시오. 모든 mouseUpFun를 사용하는 경우

, 당신은 removeEventListener 해당를 제공 할 수

input.removeEventListener('onmouseup', mouseUpFun); 
+0

가장 좋은 방법은 for (var i = 0, len = inputs.length; i

+0

각 루프 반복마다 길이 재 계산의 성능 저하를 피하려면 –

+0

@CaseyFlynn 충격? 매번 다시 계산해야합니까? 배열이 수정 될 때마다 업데이트되는 속성이 있다고 상상해보십시오. 이러한 성능 최적화에 대해서는 조심스럽게 생각합니다. –

0

https://developer.mozilla.org/en-US/docs/Web/API/EventTarget.removeEventListener

참조하면 removeEventListener를 사용하는 경우, 당신은 제거 할 리스너 함수에 대한 참조가 필요합니다.

그렇다면, 당신은 할 수 :

당신이 청취자의 참조를 절약 할 수 귀하의 addEvent 기능으로
  • 당신이 요소를 복제하고 그것을 대체 할 수

또는

  • 를 추가 클론. 이렇게하면 모든 이벤트 리스너 (해당 하위 이벤트 리스너 포함)가 삭제됩니다.
관련 문제