ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScriptのremoveEventListener()が機能しないのはなぜですか?

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

Susan Sarandon
Susan Sarandonオリジナル
2024-11-02 14:42:30671ブラウズ

Why is my JavaScript removeEventListener() not working?

Javascript RemoveEventListener が機能しない

このコードでは、addEventListener() メソッドを使用してイベント リスナーが要素に追加されます。

area.addEventListener('click',function(event) ...,true);

その後、別の関数で、removeEventListener() メソッドを使用してイベント リスナーを削除しようとします。

area.removeEventListener('click',function(event) ...,true);

ただし、イベント リスナーは削除されません。なぜこのようなことが起こるのでしょうか?

問題:
問題は、addEventListener() メソッドと RemoveEventListener() メソッドに引数として渡される 2 つの匿名関数が 2 つであるという事実にあります。 🎜>異なる機能。イベント リスナーが次のコードで追加されると:

area.addEventListener('click',function(event) ...,true);
ランタイムは新しい一意の匿名関数オブジェクトを作成し、それをエリア要素のクリック イベント ハンドラーに割り当てます。

Whenイベント リスナーは次のコードで削除されます。

area.removeEventListener('click',function(event) ...,true);

異なる の新しい一意の匿名関数オブジェクトが作成され、エリア要素のクリック イベント ハンドラーに割り当てられます。最初の関数は削除されないため、クリック イベントの処理を継続します。

解決策:イベント リスナーを正しく削除するには、removeEventListener() メソッドを提供する必要があります。 addEventListener() メソッドに渡されたのと同じ関数オブジェクトへの参照を使用します。これを行うには、イベント リスナーを名前付き関数として定義し、その名前付き関数を addEventListener() メソッドと RemoveEventListener() メソッドの両方への引数として使用する必要があります。例:

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

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。