jQueryを使っていてpreventDefault()が効かなくて困るやつ

【jQuery-3.4.1】

jQueryを使用していると、最近のChromeではパフォーマンスを落とさないようにするため、preventDefault()できないようにしてあって困る事がある。
そう。あれだ。
「Unable to preventDefault inside passive event listener due to target being treated as passive.」
とか言われて怒られるやつだ。

以前国内の記事を検索したときには簡単に対処できる方法がなかったので、jQueryらしい対応方法を記述しておく。

$.event.special.mousemove =
	{
		setup: function( _, ns, handle )
	{
		this.addEventListener("mousemove", handle, { passive: false });
	}
};

こんな感じ。

簡単に解説すると、jQueryで使用するmousemoveっていうイベントトリガーに対して、{ passive: false }を設定することでpreventDefault()が機能するように設定している。
※何がpassiveなのかについては、検索して他の記事を参考にすると詳しい解説が出ているだろう。
この方法では他のトリガー、例えばtouchmoveなどでも同様に機能する。
ただしこれは、jQueryで扱う指定したすべてのトリガーに対して有効になってしまうから注意してほしい。
Chromeの言う通り、プログラムの組み方によってはパフォーマンスの低下に繋がる可能性はある。

ただし、IEでは問題が出るみたいなので注意が必要。
IEでは、addEventListenerの第3引数が既存で、新たに追加したpassive:falseみたいなオプションが別のものとして機能してしまうようだ。

なお「いや、これ何に使うやつの話？」とかいうツッコミは禁止だ。
壁にぶつかったときにたまたまこの記事に出会うくらいが丁度いい。

それではみなさん。
Enjoy jQuery