HTML 5 Event Attributes
Standard 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.
To learn more about programming events, please visit our JavaScript tutorial and our DHTML tutorial.
Below are the standard event attributes that can be inserted into HTML 5 elements to define event actions.
New : New event attributes in HTML 5.
<body> Event Attributes
The "onload" attribute can only be used in the <body> tag:
| Attribute |
Value |
Description |
| onload |
script |
Script to be run when a document loads |
Form Events
The attributes below can be used 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 |
script |
Script to be run when a context menu is triggered |
| onfocus |
script |
Script to be run when an element gets focus |
| onformchange |
script |
|
| onforminputNew |
script |
|
| oninputNew |
script |
|
| oninvalidNew |
script |
|
| onreset |
script |
Script to be run when a form is reset.
Not supported in HTML 5. |
| onselect |
script |
Script to be run when an element is selected
|
| onsubmit |
script |
Script to be run when a form is submitted
|
Keybord Events
Valid in all elements except base, bdo, br, head, html, iframe, meta, param, script, style, and title.
| Attribute |
Value |
Description |
| onkeydown |
script |
Script to be run when a key is pressed |
| 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:
| Attribute |
Value |
Description |
| onclick |
script |
Script to be run on a mouse click |
| ondblclick |
script |
Script to be run on a mouse double-click
|
| ondragNew |
script |
Script to be run when an element is dragged |
| ondragendNew |
script |
Script to be run at the end of a drag operation |
| ondragenterNew |
script |
Script to be run when an element has been dragged to a valid
drop target |
| ondragleaveNew |
script |
Script to be run when an element leaves a valid drop target |
| ondragoverNew |
script |
Script to be run when an element is being dragged over a
valid drop target |
| ondragstartNew |
script |
Script to be run at the start of a drag operation |
| ondropNew |
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
|
| onmouseover |
script |
Script to be run when the mouse pointer moves over an
element
|
| onmouseout |
script |
Script to be run when the mouse pointer moves out of an
element
|
| onmouseup |
script |
Script to be run when a mouse button is released
|
| onmousewheelNew |
script |
Script to be run when the mouse wheel is being rotated |
| onscrollNew |
script |
Script to be run when an element's scrollbar is beeing scrolled. |
Media Events
The attributes below can be used in media elements, such as audio, embed, img, object, and video:
| Attribute |
Value |
Description |
| onabort |
script |
Script to be run on an abort event |
| oncanplayNew |
script |
Script to be run when media can start play, but might has to
stop for buffering. |
| oncanplaythroughNew |
script |
Script to be run when media can be played to the end, without
stopping for buffering. |
| ondurationchangeNew |
script |
Script to be run when the length of the media is changed. |
| onemptiedNew |
script |
Script to be run when a media resource element suddenly becomes
empty. (network errors, errors on load etc.) |
| onendedNew |
script |
Script to be run when media has reach the end. |
| onerrorNew |
script |
Script to be run when an error occurs during the loading of an
element |
| onloadeddataNew |
script |
Script to be run when media data is loaded. |
| onloadedmetadataNew |
script |
Script to be run when the duration and other media data of a
media element is loaded. |
| onloadstartNew |
script |
Script to be run when the browser starts to load the media
data. |
| onpauseNew |
script |
Script to be run when media data is paused. |
| onplayNew |
script |
Script to be run when media data is going to start playing. |
| onplayingNew |
script |
Script to be run when media data has start playing. |
| onprogressNew |
script |
Script to be run when the browser is fetching the media data. |
| onratechangeNew |
script |
Script to be run when the media data's playing rate has
changed. |
| onreadystatechangeNew |
script |
|
| onseekedNew |
script |
Script to be run when a media element's seeking attribute is no
longer true, and the seeking has ended. |
| onseekingNew |
script |
Script to be run when a media element's seeking attribute is
true, and the seeking has begun. |
| onstalledNew |
script |
Script to be run when there is an error in fetching media data.
(stalled) |
| onsuspendNew |
script |
Script to be run when the browser has been fetching media data,
but stopped before the entire media file was fetched. |
| ontimeupdateNew |
script |
Script to be run when media changes its playing position. |
| onvolumechangeNew |
script |
Script to be run when media changes the volume, also when
volume is set to "mute". |
| onwaitingNew |
script |
Script to be run when media has stopped playing, but is
expected to resume. |
Other Event Attributes
| Attribute |
Value |
Description |
| onmessageNew |
script |
Script to be run when a message event is being triggered |
| onshowNew |
script |
|
Make your web applications look like a million bucks
|
|
Most web applications today use boring methods to present data to their viewers using grids or simple HTML tables. FusionCharts induces "life" into the web applications by converting monotonous data into lively charts, gauges & maps.
FusionCharts works with all technologies like ASP, ASP.NET, PHP, ColdFusion, Ruby on Rails, JSP, HTML pages etc.
and connects to any database to render animated & interactive charts. It takes less than 15 minutes and no expertise
whatsoever to build your first chart and just a glance of it to captivate your audience. This fact is endorsed by our
12,000 customers and 150,000 users which include a majority of the Fortune 500 companies.
And yeah, your applications could look like a million bucks by spending just $69.
So go ahead, download your
copy of FusionCharts and start "wow-ing" your customers now!
|
 |
W3Schools' Online Certification Program
The perfect solution for professionals who need to balance work, family, and career building.
More than 4000 certificates already issued!
|
The HTML Certificate documents your knowledge of HTML, XHTML, and CSS.
The JavaScript Certificate documents your knowledge of JavaScript and HTML DOM.
The XML Certificate documents your knowledge of XML, XML DOM and XSLT.
The ASP Certificate documents your knowledge of ASP, SQL, and ADO.
The PHP Certificate documents your knowledge of PHP and SQL (MySQL).
|
