カントの使用私は彼らに上をクリックする能力を与えるクラスのコール<strong>ダイコン</strong>、と私はaddEventlistnerを使用するいくつかのイメージを持っていますが、今私はeventlistnerを取り除くためにしたい、何とか私はそれを作るカントイベントリスナに

Question

function attachEvent(element, event, callbackFunction) { 
    if(element.addEventListener) { 
    element.addEventListener(event, function(){ 
     removeArray(); 
     callbackFunction(this.getAttribute("src")); 
    }, false); 
    } 
} 


function removeEvent(){ 
    var element = document.querySelectorAll('.Dicon'); 
    element.removeEventListener("click", handler); 
    console.log("remove"); 
} 

を削除仕事、私はエラーを持っています。

エラー

Uncaught TypeError: element.removeEventListener is not a function 

は、どのように私はこの問題を解決するのですか？彼らはすべてイメージです。あなたは、各項目からリスナーを削除する項目をループする必要があるので、

Answer 1

document.querySelectorAll()は、htmlCollectionを返します。

var element = document.querySelectorAll('.Dicon'); 
Array.prototype.forEach.call(element, function(el) { 
    el.removeEventListener("click", handler); 
}); 

もまったく同じ関数参照のハンドラを削除する方法について何@T.J. Crowder states in his answer's第二のブロックに注意してください。

Answer 2

querySelectorAllは、コレクションを返します。単一の要素ではありません。最初に一致する要素のみを取得する場合は、querySelector（no All）を使用します。そうでない場合は、コレクションにインデックスを作成します（最初に一致する要素の場合は[0]、2番目の場合は[1]）。lengthを使用していくつあるかを知ります。

handlerも定義する必要があります。あなたはハンドラを削除するために、あなたが与えたとしてremoveEventListenerに同じ関数リファレンスを提供する必要があり、あなたがあなたの最初のコードブロックでaddEventListenerを使用して添付しましたハンドラを削除しないでき

注意addEventListenerに、関数式を直接addEventListenerに渡したため、その参照がありません。

後でハンドラを削除するためにその参照をどこかに保持する必要があります（変数やプロパティなど）。