ホームページ  >  記事  >  ウェブフロントエンド  >  HTMLイベント

HTMLイベント

WBOY
WBOYオリジナル
2024-09-04 16:14:20904ブラウズ

Web ページまたは HTML スクリプト (ハイパーテキスト マークアップ言語) を使用して作成された Web サイトでは、ユーザーおよび Web ツール自体によって実行されるすべてのアクションは HTML イベントと呼ばれます。説明には、各イベントの 6 種類の属性 (ウィンドウ イベント属性、フォーム イベント属性、キーボード イベント属性、マウス イベント属性、メディア イベント属性、およびクリップボード イベント属性) が含まれます。これらの各イベント属性には、HTML イベントの詳細を取得するために使用される特定の専用属性があります。

さまざまな種類の HTML イベント

HTML5 では多数のイベント属性が使用でき、主に 6 つの異なるタイプに分類されます。これらの属性は JavaScript 言語を使用して機能します。

HTMLイベント

  • Windows イベント属性: これは、Windows オブジェクトのアクションに提供されます。これは body タグ で機能します。
  • フォーム イベント属性: ユーザーが入力データ、キャンセル、送信などのアクションをフォームで実行すると、これらのイベント属性が機能します。
  • キーボード イベント属性: このキーボード イベント属性は、キーボード アクションとユーザー インタラクションに使用されます。
  • マウス イベント属性: 移動、クリック、ホイールなどのマウス アクションに使用されるマウス イベント属性
  • クリップボード イベント属性: このイベント属性はクリップボード アクションに使用されます: 例: カット、コピー、ペスト。
  • メディア イベント属性: このイベント属性はビデオなどのメディア ファイルに対して機能します。

イベント属性の説明

以下にイベント属性について詳しく説明します。

1. Windows イベント属性

Attribute

Description

onafterprint This script act, though, after the document printed.
onbeforeprint This script act, though, before a document printed.
onbeforeunload Whereas before the unloaded document, this Script works.
onerror  In the document occurs the Error then this event executed.
onhashchange  The anchor part of URL change in the document that time event executed.
onload When the first Web page is loaded completely, then this event executed.
onmessage In the document, the message that occurred at that time event executed.
onoffline If the network connection is unavailable and the browser says offline, then the event executed.
ononline When the network available in the browser, then the event executed.
onpagehide This script act; if the user not working on a current webpage, a then-current page can be hidden.
onpageshow This script act at that time the current webpage is load.
onpopstate This script automatically works on the browser for a history state change.
onresize This script act when the browser of the window changes the size.
onstorage When users web storage updated, then the event executed.
onunload The user’s current web page is not loaded or the window is closed, then the event is executed.
属性

説明

アフタープリント上 このスクリプトは、ドキュメントが印刷された後に動作します。 印刷前 ただし、このスクリプトはドキュメントが印刷される前に動作します。 アンロード前 ドキュメントがアンロードされる前では、このスクリプトは機能します。 エラー時 ドキュメント内でエラーが発生し、このイベントが実行されました。 ハッシュチェンジについて イベントが実行されたときにドキュメント内の URL のアンカー部分が変更されます。 オンロード 最初の Web ページが完全に読み込まれると、このイベントが実行されます。 メッセージ上 ドキュメント内で、イベントが実行されたときに発生したメッセージ。 オフライン ネットワーク接続が利用できず、ブラウザにオフラインと表示された場合、イベントが実行されました。 オンライン ブラウザでネットワークが利用可能な場合、イベントが実行されます。 ページ非表示 このスクリプトは動作します。ユーザーが現在の Web ページで作業していない場合は、その時点の現在のページを非表示にすることができます。 ページショー このスクリプトは、現在の Web ページが読み込まれるときに動作します。 オンポップステート このスクリプトはブラウザ上で自動的に動作し、履歴状態が変更されます。 サイズ変更中 このスクリプトは、ブラウザのウィンドウのサイズが変更されたときに動作します。 ストレージ ユーザーの Web ストレージが更新されると、イベントが実行されました。 アンロード時 ユーザーの現在の Web ページが読み込まれないか、ウィンドウが閉じられると、イベントが実行されます。 テーブル>

2.フォームイベント属性

Attribute Description
onblur Some form validation object loos the focus, then event fired.
onchange The value change in the form, then event fired.
onfocus In the form , ,
oninput The user gives input of value in the form then this event fired.
oninvalid The event works on when the element does not satisfy its predefined constraints.
onreset User reset the form information, then event fired.
onsearch Users search the required field, then event fired.
onselect The user selects the text or text area in form, then event fired.
onsubmit The user submits the form at the end then the event fired.

3.キーボードイベント属性

Attribute    Description
onkeydown Using a keyboard, the user press the key down at that point event works
onkeypress Using the keyboard, users press the key and display characters at that point event works.
onkeyup After the press, the key user releases the key then the event works.

4.マウスイベント属性

   Attribute Description
onclick The user clicks the mouse on the button then an event occurred.
ondblclick Users double click the mouse then the event occurred.
onmousedown The user presses the mouse button on the element then the event occurred.
onmousemove The user moves the mouse pointer over the element then the event occurred.
onmouseout The user moves the mouse outside of the element then the event occurred.
onmouseover  The user moves the mouse over the element then the event occurred.
onmouseup The user released the mouse button then the event occurred.
onmousewheel Using the mouse wheel user rolls the up and down on element then the event occurred.
onwheel Using a mouse wheel user roll them up and down then the event occurred.

5.クリップボードイベント属性

 Attribute Description
oncopy Using mouse users to copy the content, then the event occurred.
oncut Using a mouse, users cut the content then the event occurred.
onpaste Using a mouse user, paste the content, then an event occurred.

6.メディアイベント属性

Attribute Description
onabort When media files aborted for download and play again, then an event occurs.
oncanplay When any media file ready for play, then this trigger is fired.
oncanplaythrough Media file ready to play without buffering and loading.
oncuechange Element changes the cue of then event fired.
ondurationchange The Media file changes the length of time then the trigger is fired.
onemptied If the Media file unavailable and come fatal error, then the trigger is fired.
onended The Media file comes on endpoint then the trigger is fired.
onerror When an error occurred to get the media file, the trigger is fired
onloadeddata The Media file loads the data then the trigger is fired.
onloadedmetadata The Media file loads the metadata then the trigger is fired.
onloadstart The Media file starts to load then the trigger is fired.
onpause The Media file paused to play again then the trigger is fired.
onplay Media file ready to play, then trigger is fired.
onplaying The Media file starts to play when the trigger is fired.
onprogress This script act when the browser is working on connecting with the media data.
onratechange If the videos playback speed is changed, then the trigger is fired.
onseeked Users completed moving; otherwise, skip the new position of video. this attribute set as false.
onseeking The user wants to move; otherwise, skip the new position of the video. this attribute set as true.
onstalled When the browser suddenly stops to the connection of data, then the event works.
onsuspend When the web Browser on purpose does not get media data, then events work.
ontimeupdate When a user changes the video play position like forward and backward.
onvolumechange To change media volume low to high.
onwaiting If the data load the information, current video stop with buffering then event works.

結論

HTML イベントは、アクションを実行し、Web ブラウザとユーザーの間でインターフェースをとる簡単な方法です。ユーザーはあらゆるアクションの反応を簡単に得ることができます。たとえば、クリップボードの場合は切り取りとコピー、マウスの場合は移動とクリック、フォームの場合はボタンです。イベントにより Web アプリケーションがリアルタイムになり、スマートな作業システムが実現します。

以上がHTMLイベントの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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