web-dev-qa-db-ja.com

要素にイベントリスナーがあるかどうかを確認します。 jqueryなし

以下のコードのようにインライン関数を使用する場合、要素にイベントリスナーがあるかどうかを確認する方法。私は関数をリコールしてイベントリスナーを追加する関数を持っていますが、複製イベントリスナーが原因で関数を2回トリガーするためです。どうすれば確認できますか？イベントリスナーが既に存在する場合、イベントリスナーを追加することを防ぐことができます。ありがとう！ ：D

for (var a = 0;a<formFieldInput.length;a++) {
            if(formFieldInput[a].hasAttribute("name") && formFieldInput[a].attributes.title.value !== "Valid Until") {
                formFieldInput[a].addEventListener("click",function(event) {
                    toggleFieldList(event,"show");
                });
            }
javascriptweb
58
Mr. Programmer

これを実現するJavaScript関数はありません。ただし、リスナーを追加するときにtrueにブール値を設定し、削除するときにfalseに設定できます。次に、重複するイベントリスナーを追加する前に、このブール値を確認します。

重複の可能性： 動的に接続されたイベントリスナーが存在するかどうかを確認する方法？

50
Ryan Warner

最近（2016）Chrome Dev Toolsコンソールでは、この関数をすばやく実行して、要素にアタッチされたすべてのイベントリスナーを表示できます。

getEventListeners(document.querySelector('your-element-selector'));
51
arufian

する必要はありません。好きなだけ何度でも好きなだけ叩いてください。 MDNは同一のイベントリスナーを説明します ：

複数の同一のEventListenerが同じEventTargetに同じパラメーターで登録されている場合、重複するインスタンスは破棄されます。 EventListenerが2回呼び出されることはなく、removeEventListenerメソッドを使用して手動で削除する必要もありません。

25
Ron Royston