Latest web development tutorials

HTML Event

Global event properties

One new feature is that you can make HTML 4 HTML events trigger the browser's behavior, say, starting a JavaScript when a user clicks on an HTML element.

If you want to learn more about the event property, visit JavaScript Tutorial

The following table provides standard event properties, they can be inserted into HTML / XHTML elements to define event actions.

New: HTML5 new properties of the event.


Event Properties window (Window Event Attributes)

This event is triggered by the window (for <body> tag):

Attributes value description
onafterprint New script After you run the script to print the document
the OnBeforePrint New script Run script before the document is printed
onbeforeonload New script Run the script before the document is loaded
onblur script Run the script when the window loses focus
onerror New script Run the script when an error occurs
onfocus script Run the script when the window gets focus
onhaschange New script Run the script when the document changes
onload script Run the script when the document is loaded
onmessage New script Run the script when the trigger message
onoffline New script Run the script when the document is offline
ononline New script When running the script on the document line
onpagehide New script Run the script when the window is hidden
onpageshow New script Run the script when the window is visible
onpopstate New script Run the script when the window change history
onredo New script Run the script when the document is executed and then perform the operation (redo)
onResize New script Run the script when the window is resized
onstorage New script When the Web Storage Area Update (data when changes occur in the memory space) to run the script
onundo New script Run the script when the document is executed revocation
the onunload New script Run the script when the user leaves the document


Form event (Form Events)

Form event triggers (for all HTML elements, but the elements for an HTML form within a form) in an HTML form:

Attributes value description
onblur script Run the script when the element loses focus
onchange script Run the script when the element changes
oncontextmenu New script Run the script when the trigger context menu
onfocus script Run the script when the element gets focus
onformchange New script Run the script when the form changes
onforminput New script Run the script when the form to get user input
oninput New script Run the script when the element to get user input
oninvalid New script Run the script when the element is invalid
onreset script Run the script when the form is reset. HTML 5 is not supported.
onselect script Run the script when the selected element
onsubmit script Run the script when the form is submitted


Keyboard events (Keyboard Events)

Attributes value description
onkeydown script Run the script when the key is pressed
onkeypress script Run the script when you press and release the button
onkeyup script Run the script when the key is released


Mouse events (Mouse Events)

Triggered by mouse events, similar user behavior:

Attributes value description
onclick script Run the script when you click the mouse
ondblclick script Run the script when the mouse double-click
ondrag New script Run the script when the drag element
ondragend New script Run the script when the drag operation ends
ondragenter New script Run the script when the element is dragged to a valid drop target
ondragleave New script Run the script when the element leave valid drop target
ondragover New script Run the script when the element is dragged to a valid drop over the target
ondragstart New script Run the script when a drag operation begins
ondrop New script Run the script when the element is being dragged drop
onmousedown script Run the script when the mouse button is pressed
onmousemove script When the mouse pointer moves to run the script
onmouseout script Run the script when the mouse pointer moves out of the element
onmouseover script Run the script when the mouse pointer moves over the element
onmouseup script Run the script when the mouse button is released
onmousewheel New script Run the script when the mouse wheel
onscroll New script When running the script scroll scroll bar elements


Multimedia event (Media Events)

Video (videos), image (images) or audio (audio) that triggered the event, such as multi-media elements used in HTML <audio>, <embed>, <img>, <object>, and <video>):

Attributes value description
onabort script When running the script aborts event
oncanplay New script Run the script when the media can start playing but may need to stop due to buffer
oncanplaythrough New script When the media can run the script without having to stop because of the buffer to play to the end
ondurationchange New script Run the script when the media length change
onemptied New script When suddenly the media resource element is empty (network error, loading error, etc.) to run the script
onended New script Run the script when the media has arrived at the end of
onerror New script Run the script when an error occurs during the loading element
onloadeddata New script Run the script when loading media data
onloadedmetadata New script Run the script when the duration of the media and other media data elements have been loaded
onloadstart New script Run the script when the browser begins loading media data
onpause New script Run the script when the suspension of media data
onplay New script Run the script when the media data is to start playing
onplaying New script Run the script when the media data has begun to play
onprogress New script Run the script when the browser is taking the media data
onratechange New script Run the script when the media data playback rate changes
onreadystatechange New script Run the script when the ready state (ready-state) change
onseeked New script Run the script when the media element positioning properties [1] is no longer true and the positioning has ended
onseeking New script When positioning elements of the media attribute is true and the positioning has been in operation at the beginning of the script
onstalled New script Run the script when the media data retrieval process (delay) errors
onsuspend New script Run the script when the browser has been taken, but before the media data retrieval entire media file stops
ontimeupdate New script Run the script when the media changes its playback position
onvolumechange New script Or will run the script when the volume is set to mute when the media change the volume
onwaiting New script Run the script continues to play when the media has to stop playing but intend

Other events

Attributes value description
OnShow New script When the <menu> element is displayed in the context of the trigger
ontoggle New script When users open or close <details> element triggers