[解決済み] JavaScriptの無名関数のremoveEventListener
2022-02-05 03:59:40
質問
あるオブジェクトがあり、その中にメソッドがあります。これらのメソッドは、無名関数の内部でオブジェクトに入れられます。以下のような感じです。
var t = {};
window.document.addEventListener("keydown", function(e) {
t.scroll = function(x, y) {
window.scrollBy(x, y);
};
t.scrollTo = function(x, y) {
window.scrollTo(x, y);
};
});
(もっとたくさんのコードがありますが、問題を示すにはこれで十分です)
さて、場合によってはイベントリスナーを停止させたいと思います。そのため、removeEventListenerを行おうとしているのですが、その方法がわかりません。他の質問で、匿名関数でremoveEventListenerを呼び出すことはできないと読みましたが、この状況でもそうなのでしょうか?
無名関数内に作成したtのメソッドがあるため、可能だと思いました。このような感じです。
t.disable = function() {
window.document.removeEventListener("keydown", this, false);
}
なぜ、こんなことができないのか?
他に(良い)方法はないのでしょうか?
ボーナス情報として、これはSafariでのみ動作する必要があり、それゆえIEのサポートはありません。
解決するには?
無名関数のポイントは、名前と参照する方法がないことだと思います。
私だったら、名前を付けた関数を作るか、変数に入れるかして、参照を持つようにします。
var t = {};
var handler = function(e) {
t.scroll = function(x, y) {
window.scrollBy(x, y);
};
t.scrollTo = function(x, y) {
window.scrollTo(x, y);
};
};
window.document.addEventListener("keydown", handler);
そして、それを削除するには
window.document.removeEventListener("keydown", handler);
関連
-
[解決済み】Javascriptのコールバック関数がFirefoxで「Callback is not a function」というエラーを投げる
-
[解決済み】別のjsファイル内でJavaScriptの関数を呼び出す
-
[解決済み] JavaScriptで "use strict "は何をするのか、その根拠は?
-
[解決済み] JavaScriptで文字列が部分文字列を含むかどうかを確認する方法は?
-
[解決済み] あるJavaScriptファイルを他のJavaScriptファイルにインクルードするにはどうすればよいですか?
-
[解決済み] HTML5のlocalStorageにオブジェクトを格納する方法は?
-
[解決済み] JavaScriptの配列で一意な値をすべて取得する(重複を排除する)。
-
[解決済み] コールバック内で正しい `this` にアクセスする方法
-
[解決済み】JavaScriptの比較では、どちらの等号演算子(== vs ===)を使うべきですか?
-
[解決済み】オブジェクトからプロパティを削除する(JavaScript)
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】TypeError: $(...).DataTable は関数ではありません。
-
[解決済み】Failed to load resource: net::ERR_FILE_NOT_FOUND loading json.js
-
[解決済み】Uncaught ReferenceError。Reactが定義されていない
-
[解決済み】Javascript - ERR_CONTENT_LENGTH_MISMATCH
-
[解決済み】SyntaxError: JSON の位置 1 に予期しないトークン o があります。
-
[解決済み】getElementByIdはnullを返す?[クローズド]
-
[解決済み】エラー:リスン EACCES 0.0.0.0:80 OSx Node.js
-
[解決済み】エラー:リクエストのエンティティが大きすぎる
-
[解決済み】HTMLの最初の行に予期しないトークン<がある。
-
[解決済み] [Solved] Uncaught Invariant Violation: 前のレンダリング中よりも多くのフックをレンダリングする