Event Handlers
The XHTML 1.0 recommendation also allows for several event handlers that can be used to trigger the execution of script code embedded in an XHTML document. Each event handler is tied to a specific event that can occur during a person's use of a browser. When a user submits a form, for example, you can capture that event and launch a field validation script using the onsubmit event handler:
<form action="register.cgi" method="post" onsubmit="return validate();">
Thus, when a user clicks the Submit button, the scripted function named validate() executes and checks the data the user is submitting for appropriate formatting, content, or other validation checks.
Table 3.2 details the event handlers available under XHTML 1.0. Some event handlers must be used within specific elements. These special cases are noted along with the event handler in the table.
Table 3.2 XHTML 1.0 Event Handlers
Event Handler |
Triggered When... |
onload |
A document or frameset is loaded; only allowed in the <body> and <frameset> elements |
onunload |
A document or frameset is unloaded; only allowed in the <body> and <frameset> elements |
onclick |
The mouse button is clicked once |
ondblclick |
The mouse button is clicked twice |
onmousedown |
The mouse button is pressed |
onmouseup |
The mouse button is released |
onmouseover |
The mouse pointer is over a page element |
onmousemove |
The mouse pointer is moved while over a page element |
onmouseout |
The mouse pointer is moved off a page element |
onfocus |
A form field receives focus by tabbing to it or by clicking it with the mouse pointer; only allowed in the <input />, <select>, <textarea>, <label>, and <button> elements |
onblur |
A form field loses focus by tabbing out of it or by clicking a different field with the mouse pointer; only allowed in the <input />, <select>, <textarea>, <label>, and <button> elements |
onkeypress |
A key is pressed and released over a page element |
onkeydown |
A key is pressed over a page element |
onkeyup |
A key is released over a page element |
onsubmit |
A form is submitted; only allowed in the <form> element |
onreset |
A form is reset; only allowed in the <form> element |
onselect |
A user selects some text in a text field; only allowed in the <input /> and <textarea> elements |
onchange |
A form field loses focus and its value has changed since gaining focus; only allowed in the <input />, <textarea>, and <select> elements |