The W3C has defined a set of core events that are associated with nearly every HTML and/or XHTML element.
Event attributes are an important part of learning HTML so being familiar with them is a good idea. Most of these events cover simple user interaction, such as the click of a mouse button or a key being pressed.
A few elements, such as form controls, have some special events associated with them. Another useful event is onload which can be used in conjunction with the <body> element so that a script can run when the page loads.
Here is an example:
<startTag event="script">Element Content</endTag>Mouse and Keyboard Events
Mouse and keyboard events can be used when you want a particular script to be run when the mouse or keyboard interacts with an element.
The following events can be used in all elements except <base>, <bdo>, <br>, <frame>, <frameset>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>, and <title>.
| Event | Value | Description |
|---|---|---|
onclick | script | Script to run on a mouse click |
ondblclick | script | Script to run on a mouse double-click |
onmousedown | script | Script to run when mouse button is pressed |
onmousemove | script | Script to run when mouse pointer moves |
onmouseout | script | Script to run when mouse pointer moves out of an element |
onmouseover | script | Script to run when mouse pointer moves over an element |
onmouseup | script | Script to run when mouse button is released |
| Event | 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 |
Form Events
Form events are also very common and useful. The following events can be used in <form> elements:
| Event | Value | Description |
|---|---|---|
onblur | script | Script to run when an element loses focus |
onchange | script | Script to run when an element changes |
onfocus | script | Script to run when an element gets focus |
onreset | script | Script to run when a form is reset |
onselect | script | Script to run when an element is selected |
onsubmit | script | Script to run when a form is submitted |
Body and Frameset Events
There are two events that can be used with the <body> and <frameset> elements:
| Event | Value | Description |
|---|---|---|
onload | script | Script to run when a document loads |
onunload | script | Script to run when a document unloads |
Image Event
There is only one event that can be used with the <img> element:
| Event | Value | Description |
|---|---|---|
onabort | script | Script to run when loading of an image is interrupted |
