HTML DOMイベント
HTML DOMイベントは、JavaScriptがHTML文書内の要素に異なるイベントハンドラを登録することができます。
イベントは、通常の機能と組み合わせて使用され、イベントが発生する前に、関数が実行されない(such as when a user clicks a button) 。
Tip:イベントモデルは、DOMレベル2にW3Cによって標準化されました。
HTML DOMイベント
DOM:ここでDOMレベルプロパティが導入されたことを示します。
マウスイベント
キーボードイベント
フレーム/オブジェクトのイベント
フォームイベント
| イベント | 説明 | DOM |
|---|
| onblur | 要素がフォーカスを失ったときにイベントが発生します | 2 |
| onchange | フォーム要素、選択、またはチェック状態の内容が変更されたときに、イベントが発生し(for <input>, <keygen>, <select>, and <textarea>) | 2 |
| ONFOCUS | 要素がフォーカスを取得したときにイベントが発生します | 2 |
| onfocusin | 要素がフォーカスを取得しようとするときにイベントが発生します | 2 |
| onfocusout | 要素がフォーカスを失うとしているときにイベントが発生します | 2 |
| oninput | 要素がユーザの入力を取得したときにイベントが発生します | 3 |
| oninvalid | 要素が無効なときにイベントが発生します | 3 |
| onreset | フォームがリセットされたときにイベントが発生します | 2 |
| onsearch | ユーザーが検索フィールドに何かを書き込むときにイベントが発生する（ための<input =「検索」>） | 3 |
| ONSELECT | ユーザがテキストを選択した後にイベントが発生(for <input> and <textarea>) | 2 |
| onSubmit | フォームが送信されたときにイベントが発生します | 2 |
ドラッグイベント
| イベント | 説明 | DOM |
|---|
| ondrag | 要素がドラッグされているときにイベントが発生します | 3 |
| ondragend | ユーザーが要素をドラッグを終了したときにイベントが発生します | 3 |
| ondragenter | ドラッグされた要素がドロップターゲットに入ったときにイベントが発生します | 3 |
| ondragleave | ドラッグされた要素がドロップターゲットから離れたときにイベントが発生します | 3 |
| OnDblClick | ドラッグされた要素がドロップターゲット上にあるときにイベントが発生します | 3 |
| ondragstart | ユーザーが要素のドラッグを開始したときにイベントが発生します | 3 |
| ondrop | ドラッグされた要素をドロップターゲットにドロップされたときイベントが発生します | 3 |
クリップボードのイベント
| イベント | 説明 | DOM |
|---|
| oncopy | イベントは、要素のユーザコピーコンテンツを発生します | |
| oncut | ユーザは要素の内容をカットするときにイベントが発生します | |
| onpaste | ユーザは要素の一部の内容を貼り付けたときにイベントが発生します | |
印刷イベント
メディアイベント
| イベント | 説明 | DOM |
|---|
| onabort | メディアの読み込みが中止されたときにイベントが発生します | 3 |
| oncanplay | （それが開始するのに十分なバッファリングしたとき）、ブラウザは、メディアの再生を開始することができたときにイベントが発生します | 3 |
| oncanplaythrough | ブラウザは、バッファリングのために停止することなく、メディアを通じて再生することができたときにイベントが発生します | 3 |
| ondurationchange | メディアの期間が変更されたときにイベントが発生します | 3 |
| onemptied | 悪い何かが起こるときにイベントが発生し、メディアファイルが突然利用できない(like unexpectedly disconnects) | 3 |
| onended | メディアが終わりに達していたときにイベントが発生します(useful for messages like "thanks for listening") | 3 |
| ONERROR | エラーがメディアファイルのロード中に発生したときにイベントが発生します | 3 |
| onloadeddata | メディアデータがロードされたときにイベントが発生します | 3 |
| onloadedmetadata | メタデータと、イベントが発生し(like dimensions and duration)ロードされています | 3 |
| onloadstart | ブラウザが指定したメディアを探し始めたときにイベントが発生します | 3 |
| onpause | メディアは、ユーザによっても、プログラムによっても一時停止されたときにイベントが発生します | 3 |
| onplay | イベントは、メディアが開始された際に発生していないか、もはや一時停止されています | 3 |
| onplaying | メディアがバッファリングのために一時停止または停止された後に再生しているときにイベントが発生します | 3 |
| onprogress | ブラウザは、メディアデータを取得する過程にあるときにイベントが発生します(downloading the media) | 3 |
| onratechange | メディアの再生速度を変更したときにイベントが発生します | 3 |
| onseeked | ユーザーがメディア内の新しい位置へスキップ/移動完了したときにイベントが発生します | 3 |
| onseeking | ユーザがメディア内の新しい位置へスキップ/移動を開始したときにイベントが発生します | 3 |
| onstalled | ブラウザは、メディアデータを取得しようとしているときにイベントが発生しますが、データは使用できません。 | 3 |
| onsuspend | ブラウザが意図的にメディアデータを取得していないときにイベントが発生します | 3 |
| ontimeupdate | 再生位置が変更されたときにイベントが発生した（のようなときに、メディアの異なる点にユーザ早送り） | 3 |
| onvolumechange | メディアの音量が変更されたときのイベントは（「ミュート」に音量を設定含む）が発生します | 3 |
| onwaiting | メディアが一時停止していたが（メディアは、より多くのデータをバッファリングするために一時停止したときのような）を再開することが予想されたときにイベントが発生します | 3 |
アニメーションのイベント
遷移イベント
サーバー送信されたイベント
| イベント | 説明 | DOM |
|---|
| ONERROR | エラーがイベントソースで発生したときにイベントが発生します | |
| onMessage | メッセージは、イベント・ソースを介して受信されたときにイベントが発生します | |
| 開く時] | イベントソースとの接続が開かれたときにイベントが発生します | |
その他のイベント
| イベント | 説明 | DOM |
|---|
| onMessage | メッセージはオブジェクトを介して、またはから受信したときにイベントが発生する(WebSocket, Web Worker, Event Source or a child frame or a parent window) | 3 |
| onmousewheel | 推奨されていません。 使用onwheel代わりにイベントを | |
| ononline | ブラウザがオンラインで作業を開始したときにイベントが発生します | 3 |
| onoffline | ブラウザがオフラインで作業を開始したときにイベントが発生します | 3 |
| onpopstate | ウィンドウの歴史が変わったときにイベントが発生します | 3 |
| onshow | ときに、イベントが発生し<menu>要素がコンテキストメニューとして示されています | 3 |
| onstorage | ウェブストレージ領域が更新されたときにイベントが発生します | 3 |
| ontoggle | ユーザーの開閉時にイベントが発生し<details>要素を | 3 |
| onwheel | マウスホイールが要素の上に上または下に移動したときにイベントが発生します | 3 |
タッチイベント
| イベント | 説明 | DOM |
|---|
| ontouchcancel | タッチが中断されたときにイベントが発生します | |
| ontouchend | 指がタッチスクリーンから削除されたときにイベントが発生します | |
| ontouchmove | 指が画面上でドラッグされたときにイベントが発生します | |
| ontouchstart | 指がタッチスクリーン上に置かれたときにイベントが発生します | |
イベントオブジェクト
定数
| 定数 | 説明 | DOM |
|---|
| CAPTURING_PHASE | 現在のイベントフェーズはキャプチャ段階である(1) | 1 |
| AT_TARGET | それはイベントターゲットで評価されている、すなわち、現在のイベントは、目標位相にある(2) | 2 |
| BUBBLING_PHASE | 現在のイベントフェーズはバブリングフェーズである(3) | 3 |
プロパティ
| プロパティ | 説明 | DOM |
|---|
| 泡 | 特定のイベントがバブリングイベントかどうかを返します。 | 2 |
| 解約 | イベントがデフォルトアクションを抑制することができかどうかを返します | 2 |
| currentTarget | そのイベントリスナーイベントをトリガーした要素を返します。 | 2 |
| defaultPrevented | 戻り値かどうかpreventDefault()メソッドは、イベントのために呼ばれました | 3 |
| eventPhase | イベントフローのフェーズが現在評価されている戻り値 | 2 |
| isTrusted | イベントは、信頼されているかどうかを返します。 | 3 |
| ターゲット | イベントをトリガーした要素を返します。 | 2 |
| timeStampに | 時間を返します(in milliseconds relative to the epoch)のイベントが作成されました | 2 |
| タイプ | イベントの名前を返します。 | 2 |
| ビュー | イベントが発生したWindowオブジェクトへの参照を返します。 | 2 |
メソッド
MouseEventオブジェクト
| プロパティ | 説明 | DOM |
|---|
| altKeyの | かどうかを返します"ALT"マウスイベントがトリガされたときにキーが押されました | 2 |
| ボタン | マウスイベントがトリガされたときにマウスボタンが押された戻り値 | 2 |
| ボタン | マウスイベントがトリガされたときにマウスボタンが押された戻り値 | 3 |
| clientX | マウスイベントがトリガされたときに水平に、現在のウィンドウに対して、マウスポインタの座標を返し | 2 |
| clientYプロパティ | マウスイベントがトリガされたときに垂直に、現在のウィンドウに対して、マウスポインタの座標を返し | 2 |
| ctrlKey | かどうかを返します"CTRL"マウスイベントがトリガされたときにキーが押されました | 2 |
| ディテール | マウスがクリックされた回数を示す数値を返します | 2 |
| metakeyな | かどうかを返します"META"イベントがトリガされたときにキーが押されました | 2 |
| pageX | 水平マウスイベントがトリガされた文書に対して、マウスポインタの座標を返し | |
| pageY | 垂直マウスイベントがトリガされた文書に対して、マウスポインタの座標を返し | |
| relatedTarget | マウスイベントをトリガした要素に関連する要素を返します | 2 |
| がscreenX | イベントがトリガされたときに、水平に、画面に対して、マウスポインタの座標を返し | 2 |
| screenYの | イベントがトリガされたときに、垂直に、画面に対して、マウスポインタの座標を返し | 2 |
| shiftKey | かどうかを返します"SHIFT"イベントがトリガされたときにキーが押されました | 2 |
| これ | マウスイベントがトリガされたときにマウスボタンが押された戻り値 | 2 |
KeyboardEventオブジェクト
| プロパティ | 説明 | DOM |
|---|
| altKeyの | かどうかを返します"ALT"キーイベントがトリガされたときにキーが押されました | 2 |
| ctrlKey | かどうかを返します"CTRL"キーイベントがトリガされたときにキーが押されました | 2 |
| charCodeは | OnKeyPressイベントをトリガしたキーのUnicode文字コードを返します。 | 2 |
| キー | イベントによって表されたキーのキー値を返します。 | 3 |
| キーコード | OnKeyPressイベントをトリガーキー、またはonKeyDownメソッドまたはonkeyupのイベントをトリガしたキーのキーコードのUnicodeのUnicode文字コードを返します。 | 2 |
| ロケーション | キーボードやデバイス上のキーの位置を返します。 | 3 |
| metakeyな | かどうかを返します"meta"キーイベントがトリガされたときにキーが押されました | 2 |
| shiftKey | かどうかを返します"SHIFT"キーイベントがトリガされたときにキーが押されました | 2 |
| これ | OnKeyPressイベントをトリガーキー、またはonKeyDownメソッドまたはonkeyupのイベントをトリガしたキーのキーコードのUnicodeのUnicode文字コードを返します。 | 2 |
HashChangeEventオブジェクト
| プロパティ | 説明 | DOM |
|---|
| NEWURL | ハッシュが変更された後、ドキュメントのURLを返します。 | |
| oldURL | ハッシュが変更される前に、ドキュメントのURLを返します。 | |
PageTransitionEventオブジェクト
| プロパティ | 説明 | DOM |
|---|
| 持続 | Webページがブラウザによってキャッシュされたかどうかを返します | |
FocusEventオブジェクト
AnimationEventオブジェクト
TransitionEventオブジェクト
| プロパティ | 説明 | DOM |
|---|
| プロパティ名 | 移行に関連付けられているCSSプロパティの名前を返します。 | |
| 経過時間 | 秒数の遷移が実行されている返します | |
WheelEventオブジェクト
| プロパティ | 説明 | DOM |
|---|
| DELTAX | マウスホイールの水平スクロール量を返し(x-axis) | 3 |
| deltaY移動 | マウスホイールの垂直スクロール量を返し(y-axis) | 3 |
| deltaZ | Z軸のマウスホイールのスクロール量を返し | 3 |
| deltaMode | デルタ値の測定の単位を表す数値を返し(pixels, lines or pages) | 3 |