Home>Article>Web Front-end> What are the html events?
html events include: 1. Window events triggered by window objects; 2. Form events triggered by actions within HTML forms; 3. Keyboard events; 4. Mouse events triggered by mouse or similar user actions ;5. Media events triggered by media (such as videos, images, and audio).
The operating environment of this tutorial: Windows 7 system, HTML5 version, Dell G3 computer.
HTML has the ability to have events trigger actions in the browser, such as launching JavaScript when a user clicks on an element.
Events in html
1. Window events
Events triggered for the window object (applied totag):
Attribute | Value | Description |
---|---|---|
onafterprint | script | Script that runs after the document is printed. |
onbeforeprint | script | Script that runs before document printing. |
onbeforeunload | script | Script that runs before the document is unloaded. |
onerror | script | Script that runs when an error occurs. |
onhaschange | script | A script that runs when the document has changed. |
onload | script | Triggered after the page has finished loading. |
onmessage | script | Script that runs when a message is triggered. |
onoffline | script | Script that runs when the document is offline. |
ononline | script | Script that runs when the document goes online. |
onpagehide | script | Script that runs when the window is hidden. |
onpageshow | script | Script that runs when the window becomes visible. |
onpopstate | script | Script that runs when the window history changes. |
onredo | script | Script that runs when the document performs redo. |
onresize | script | Fired when the browser window is resized. |
onstorage | script | Script that runs after the Web Storage zone is updated. |
onundo | script | Script that runs when the document executes undo. |
onunload | script | Fires once the page has been downloaded (or the browser window has been closed). |
2. Form event
An event triggered by an action within an HTML form (applies to almost all HTML elements, but most Commonly used in form elements):
Attribute | Value | Description |
---|---|---|
script | Script that runs when the element loses focus. | |
script | Script that runs when the element value is changed. | |
script | Script that runs when the context menu is triggered. | |
script | Script that runs when an element gets focus. | |
script | Script that runs when the form changes. | |
script | Script that runs when the form gets user input. | |
script | A script that runs when the element gets user input. | |
script | Script that runs when an element is invalid. | |
script | Fires when the reset button in the form is clicked. Not supported in HTML5. | |
script | Fires after the text in the element is selected. | |
script | Fires when the form is submitted. |
3. Keyboard event
4. Mouse event
Events triggered by mouse or similar user actions:
Value | Description | |
---|---|---|
script | Fires when the user presses a key. | |
script | Fires when the user taps the button. | |
script | Fires when the user releases the key. |
Properties | Value | Description |
---|---|---|
onclick | script | Fires when a mouse click occurs on the element. |
ondblclick | script | Fires when a mouse double-click occurs on the element. |
ondrag | script | Script that runs when the element is dragged. |
ondragend | script | Script that runs at the end of a drag operation. |
ondragenter | script | A script that runs when an element has been dragged into a valid drag and drop area. |
ondragleave | script | Script that runs when an element leaves a valid drag-and-drop target. |
ondragover | script | Script that runs when an element is being dragged on a valid drag target. |
ondragstart | script | Script that runs at the beginning of a drag operation. |
ondrop | script | Script that runs when the dragged element is being dragged and dropped. |
onmousedown | script | Fires when the mouse button is pressed on the element. |
onmousemove | script | Fires when the mouse pointer moves over an element. |
onmouseout | script | Fires when the mouse pointer moves out of the element. |
onmouseover | script | Fires when the mouse pointer moves over an element. |
onmouseup | script | Fires when the mouse button is released on the element. |
onmousewheel | script | Script that runs when the mouse wheel is being rolled. |
onscroll | script | Script that runs when the element scroll bar is scrolled. |
5. Media event
Events triggered by media (such as video, image and audio) (applicable to all HTML elements, but commonly found in media elements, such as >