JavaScript の「removeEventListener」が機能しないのはなぜですか?

JavaScript のremoveEventListener が機能しないのはなぜですか?

イベント リスナーを削除しようとすると、ユーザーは問題に遭遇する可能性があります。その実装には問題があります。この問題に対処するために、提供されたコードを分析してみましょう。

指定された例では、イベント リスナーがクリック イベントの area という名前の要素にアタッチされています。ただし、後で別の関数でリスナーを削除しようとすると、リスナーの削除に失敗します。

この失敗の理由は、addEventListener とremoveEventListener に渡される 2 つの匿名関数が別個の関数であるという事実にあります。どちらもエリア上のクリック イベントを処理しますが、同じ関数オブジェクトではありません。その結果、addEventListener から同じ匿名関数参照を使用してイベント リスナーを削除することはできません。

この問題を解決するには、イベント リスナーの追加と削除の両方に同じ匿名関数参照を使用する必要があります。これにより、removeEventListener 関数が前に追加された特定のリスナーを正しくターゲットにして削除できるようになります。

修正されたコード スニペットの例を次に示します。

<code class="javascript">function foo(event) {
     app.addSpot(event.clientX,event.clientY);
     app.addFlag = 1;
 }
 area.addEventListener('click',foo,true);
 area.removeEventListener('click',foo,true);</code>

イベント ハンドラーに foo などの名前付き関数を利用することで、イベント リスナーの追加と削除の両方で同じ関数オブジェクトを参照でき、必要なときにリスナーが正しく削除されることが保証されます。

以上がJavaScript の「removeEventListener」が機能しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。