Global Event Attributes
HTML 4 added the ability to let events trigger actions in a browser, like starting a JavaScript when a user clicks on an element.
((new)) : ((new)) event attributes in HTML5.
Window Event Attributes
Events triggered for the window object (applies to the <body> tag):
| Attribute | Value | Description |
| onafterprint(new) | script | Script to be run after the document is printed |
| onbeforeprint(new) | script | Script to be run before the document is printed |
| onbeforeonload(new) | script | Script to be run before the document loads |
| onblur | script | Script to be run when the window loses focus |
| onerror(new) | script | Script to be run when an error occur |
| onfocus | script | Script to be run when the window gets focus |
| onhaschange(new) | script | Script to be run when the document has changed |
| onload | script | Script to be run when the document loads |
| onmessage(new) | script | Script to be run when the message is triggered |
| onoffline(new) | script | Script to be run when the document goes offline |
| ononline(new) | script | Script to be run when the document comes online |
| onpagehide(new) | script | Script to be run when the window is hidden |
| onpageshow(new) | script | Script to be run when the window becomes visible |
| onpopstate(new) | script | Script to be run when the window's history changes |
| onredo(new) | script | Script to be run when the document performs a redo |
| onresize(new) | script | Script to be run when the window is resized |
| onstorage(new) | script | Script to be run when the document loads |
| onundo(new) | script | Script to be run when the document performs an undo |
| onunload(new) | script | Script to be run when the user leaves the document |
Form Events
Events triggered by actions inside a HTML form (applies to all HTML5 elements, but is most common in form elements):
| Attribute | Value | Description |
| onblur | script | Script to be run when an element loses focus |
| onchange | script | Script to be run when an element changes |
| oncontextmenu(new) | script | Script to be run when a context menu is triggered |
| onfocus | script | Script to be run when an element gets focus |
| onformchange(new) | script | Script to be run when a form changes |
| onforminput(new) | script | Script to be run when a form gets user input |
| oninput(new) | script | Script to be run when an element gets user input |
| oninvalid(new) | script | Script to be run when an element is invalid |
| onreset | script | Script to be run when a form is reset Not supported in HTML5 |
| onselect | script | Script to be run when an element is selected |
| onsubmit | script | Script to be run when a form is submitted |
Keyboard Events
Events triggered by a keyboard (applies to all HTML5 elements):
| Attribute | Value | Description |
| onkeydown | script | Script to be run when a key is pressed down |
| onkeypress | script | Script to be run when a key is pressed and released |
| onkeyup | script | Script to be run when a key is released |
Mouse Events
Events triggered by a mouse, or similar user actions (applies to all HTML5 elements):
| Attribute | Value | Description |
| onclick | script | Script to be run on a mouse click |
| ondblclick | script | Script to be run on a mouse double-click |
| ondrag(new) | script | Script to be run when an element is dragged |
| ondragend(new) | script | Script to be run at the end of a drag operation |
| ondragenter(new) | script | Script to be run when an element has been dragged to a valid drop target |
| ondragleave(new) | script | Script to be run when an element leaves a valid drop target |
| ondragover(new) | script | Script to be run when an element is being dragged over a valid drop target |
| ondragstart(new) | script | Script to be run at the start of a drag operation |
| ondrop(new) | script | Script to be run when dragged element is being dropped |
| onmousedown | script | Script to be run when a mouse button is pressed |
| onmousemove | script | Script to be run when the mouse pointer moves |
| onmouseout | script | Script to be run when the mouse pointer moves out of an element |
| onmouseover | script | Script to be run when the mouse pointer moves over an element |
| onmouseup | script | Script to be run when a mouse button is released |
| onmousewheel(new) | script | Script to be run when the mouse wheel is being rotated |
| onscroll(new) | script | Script to be run when an element's scrollbar is being scrolled |
Media Events
Events triggered by medias like videos, images and audio (applies to all HTML5 elements, but is most common in media elements, like audio, embed, img, object, and video):
| Attribute | Value | Description |
| onabort | script | Script to be run on abort |
| oncanplay(new) | script | Script to be run when a file is ready to start playing (when it has buffered enough to begin) |
| oncanplaythrough(new) | script | Script to be run when a file can be played all the way to the end without pausing for buffering |
| ondurationchange(new) | script | Script to be run when the length of the media changes |
| onemptied(new) | script | Script to be run when something bad happens and the file is suddenly unavailable (like unexpectedly disconnects) |
| onended(new) | script | Script to be run when the media has reach the end (a useful event for messages like "thanks for listening") |
| onerror(new) | script | Script to be run when an error occurs when the file is being loaded |
| onloadeddata(new) | script | Script to be run when media data is loaded |
| onloadedmetadata(new) | script | Script to be run when meta data (like dimensions and duration) are loaded |
| onloadstart(new) | script | Script to be run just as the file begins to load before anything is actually loaded |
| onpause(new) | script | Script to be run when the media is paused either by the user or programmatically |
| onplay(new) | script | Script to be run when the media is ready to start playing |
| onplaying(new) | script | Script to be run when the media actually has started playing |
| onprogress(new) | script | Script to be run when the browser is in the process of getting the media data |
| onratechange(new) | script | Script to be run each time the playback rate changes (like when a user switches to a slow motion or fast forward mode) |
| onreadystatechange(new) | script | Script to be run each time the ready state changes (the ready state tracks the state of the media data) |
| onseeked(new) | script | Script to be run when the seeking attribute is set to false indicating that seeking has ended |
| onseeking(new) | script | Script to be run when the seeking attribute is set to true indicating that seeking is active |
| onstalled(new) | script | Script to be run when the browser is unable to fetch the media data for whatever reason |
| onsuspend(new) | script | Script to be run when fetching the media data is stopped before it is completely loaded for whatever reason |
| ontimeupdate(new) | script | Script to be run when the playing position has changed (like when the user fast forwards to a different point in the media) |
| onvolumechange(new) | script | Script to be run each time the volume is changed which (includes setting the volume to "mute") |
| onwaiting(new) | script | Script to be run when the media has paused but is expected to resume (like when the media pauses to buffer more data) |
No comments:
Post a Comment