イベントハンドラー

イベントハンドラーについて

「要素を押した」など、ある動作を起こした時に発生するイベントに対して処理を行うことをイベントハンドラーといいます。
ここでは、イベントの一覧をご紹介します。

イベント一覧

• ※ ここで掲載しているイベントは一部です。

マウスイベント

ドラッグ・ドロップイベント

タッチイベント

マウス・タッチ総合イベント

キーボードイベント

フレーム・オブジェクトイベント

フォームイベント

クリップボードイベント

トランジションベント

アニメーションイベント

その他イベント

mouseover、mouseenterについて

mouseover、mouseenterはどちらもマウスカーソルがのった時に発生するイベントですが、次の違いがあります。

mouseoverイベントはmouseoverイベントが発火された要素の子要素もイベントの対象となり、処理がその分だけ発生してしまいます。
この現象をイベントバブリングといいますが、このイベントバブリングを無視するのがmouseenterイベントになります。

mouseout、mouseleaveについて

mouseover、mouseenterはどちらもマウスカーソルが離れた時に発生するイベントですが、次の違いがあります。

mouseoutイベントはmouseoutイベントが発火された要素の子要素もイベントの対象となり、処理がその分だけ発生してしまいます。
この現象をイベントバブリングといいますが、このイベントバブリングを無視するのがmouseleaveイベントになります。

onpageshowについて

ブラウザの戻るボタンなどで前のページに戻った際に、最後の状態を保持（復元）することを、Back Forward Cacheと呼びますが、
このBack Forward Cacheを確認（検出）する場合は、引数「event」のpersistedプロパティを参照することで得ることができます。

window.onpageshow = function(event) {
	if (event.persisted) {
		// ...
	}
};