removeEventListener가 작동하지 않는 이유는 무엇입니까?

Question

사용자 클릭이 파란색 버튼 또는 빨간색 버튼 인 간단한 스크립트를 만드는 중입니다. 파란색 버튼을 클릭하면 사용자가 클릭하면 사라지게되어 잘 작동합니다. 그러나 사용자가 빨간색 버튼을 클릭하면 파란색의 페이드 아웃이 중지됩니다. 파란색 버튼은 작동하지만 빨간색은 작동하지 않는다고 말했던 것처럼.

여기 및 다른 사이트에서 다양한 질문과 답변을 볼 때 나는 가지고있는 코드가 정확하다고 믿습니다. 작동하지 않는 이유는 일치하지 않기 때문입니다. 즉 실제로 제거하지 않을 것입니다. 이벤트 추가.

내가 가진 코드는 다음과 도움, 나는 코드 어도비 애니메이션을 사용하고 감상 할 수있다 : 당신이 선택의 여지가

요소의 제거 이벤트 리스너를 들어

instance = this; 
instance.stop(); 

//Buttons array 
var lowerQuestions = [instance.BTN1, instance.BTN2, instance.BTN4]; 

//Add an event listener to each button in the array 
addEventListeners(); 
function addEventListeners(){ 
    lowerQuestions.forEach(function(element) { 
     element.addEventListener("click", function(){ 
      console.log('add listener'); 
      addButtonValue(element); 
     },false); 
    }); 
} 

//Remove event listeners when BTN3 is clicked 
instance.BTN3.addEventListener("click", removeEventListeners) 

function removeEventListeners(){ 
    console.log('prevent'); 

    lowerQuestions.forEach(function(element) { 
     element.removeEventListener("click", function(){ 
      console.log('remove listener'); 
       addButtonValue(element); 
      //console.log('hit me here'); 
      },false); 
    }); 

} 

//Event listener function 
function addButtonValue(element){ 
instance.addEventListener("tick", fadeOut); 
element.alpha = 1; 
    function fadeOut(){ 
     element.alpha -= 0.15; 
     if(element.alpha <= 0){ 
      instance.removeEventListener("tick", fadeOut);} 
     } 
} 

Answer 1

. 1 - 요소의 복사본을 만들어이 요소로 바꿉니다. 2 - 리스너 함수의 이름을 입력하고 전달하여 이벤트 리스너를 제거합니다. 코드에서 첫 번째 해결 방법을 제안합니다. 이 코드는이 코드를 실행해야 리스너를 제거 할 모든 단일 요소에 대해, 당신을 도울 수 : 익명 함수 표현식을 제거 할 필요가 이벤트 리스너에 좋은하지 왜

function removeEventListeners(){ 
    console.log('prevent'); 

    lowerQuestions.forEach(function(element) { 
     var cln = element.cloneNode(true); 
     element.parentNode.appendChild(cln); 
     element.parentNode.removeChild(element); 
    }); 
} 

Answer 2

Are anonymous functions able to handle removeEventListener?는 설명을 - 함수 표현식은 다른 생산 함수가 실행될 때마다 함수 객체에 추가되므로 remove 함수는 추가 된 함수와 결코 일치하지 않습니다.

function buttonClicked(){ 
    addButtonValue(this); 
} 
addEventListeners(); 
function addEventListeners(){ 
    lowerQuestions.forEach(function(element) { 
     element.addEventListener("click", buttonClicked, false); 
    }); 
} 

이름으로 이동식 청취자합니다 :

//... 

lowerQuestions.forEach(function(element) { 
    element.removeEventListener("click", buttonClicked, false); 
}); 

//... 

의