Most events in the Dynamic HTML object model are similar to the events in the Visual Basic programming model. Event names, however, are often slightly different. All event names in Dynamic HTML are preceded by the word "on." You can locate most common events by looking for them under this prefix. For example, the Visual Basic click event corresponds to onclick, load corresponds to onload, and so on.
For More Information See "Document Object Model" in the "Dynamic HTML" section of the Internet Client SDK for a full list of the properties, methods, and events available in an HTML page through the Dynamic HTML object model.
The sections below list some of the more commonly used events in Visual Basic, their counterparts in Dynamic HTML, and any additional information needed for you to use them.
Keyboard events in Dynamic HTML correspond very closely to keyboard events in Visual Basic. The following table lists the common Visual Basic keyboard events and their Dynamic HTML counterparts:
Visual Basic Event | DHTML Event | Comments |
keydown | onkeydown | Fires when a key is pressed. |
keypress | onkeypress | Fires when a user's keyboard input is translated to a character. |
keyup | onkeyup | Fires when a user releases a key. |
When a keyboard event occurs, the keycode property of Dynamic HTML's event object contains the Unicode keycode of the corresponding key. The altKey, ctrlKey, and shiftKey properties specify the state of the ALT, CTRL, and SHIFT keys. You can change which key is associated with the event by either changing the value of the keycode property or returning an integer value. You can cancel the event by returning zero or false.
Mouse events in Dynamic HTML correspond closely to mouse events in Visual Basic. The following table lists the common Visual Basic mouse events and their Dynamic HTML counterparts:
Visual Basic Event | DHTML Equivalent | Comments |
click | onclick | In addition to occurring when a user clicks on an element, this event also fires when the user presses ENTER on an element that can receive focus, such as a button. |
doubleclick | ondblclick | This event works similarly to its Visual Basic counterpart. |
mousedown, mouseup, mousemove |
onmouseout, onmousedown, onmouseup, onmousemove, onmouseover | When moving between elements, the onmouseout event fires first to indicate that the mouse has left the original element. Next the onmousemove event fires, indicating that the mouse has moved. Finally, onmouseover fires to indicate that the mouse has entered the new element. |
When a mouse event occurs, the button property of the event object identifies which mouse button (if any) is down. The x and y properties specify the location of the mouse at the time of the event. For the onmouseover and onmouseout events, the toElement and fromElement properties specify the elements the mouse is moving to and from.
Focus and selection events in Dynamic HTML differ slightly from their Visual Basic counterparts. In particular, focus events are called only from certain elements, and selection and dragging are handled differently. The following table lists the common Visual Basic focus and selection events and their Dynamic HTML counterparts:
Visual Basic Event | DHTML Equivalent | Comments |
gotfocus | onfocus | Fires when the user moves to an element capable of receiving input, such as a button or form element. |
lostfocus | onblur | Fires when you move out of an element that is capable of receiving input. |
selchange | onselectstart onselect |
The onselectstart event fires when a selection is first initiated — for example, when the user clicks a character or object in the document. Onselect fires when the user changes the selection — for example, by moving the mouse over a portion of the document while holding down the mouse button. |
dragdrop, dragover | ondragstart | Fires when the user first begins to drag the selection. The default action is to prepare the selection to be copied to another element. |
Note Onblur and onfocus fire whether you move between elements in the page, between frames, or even between applications on the desktop. For example, if a page element has focus and the user switches to another application, the onblur event fires for that element. When the user switches back, onfocus fires.
Visual Basic Event | DHTML Equivalent | Comments |
change | onchange | Onchange fires when the user tabs off or presses ENTER on an element, moving out of it. In Visual Basic, the change event fires as soon as the user performs any action within the control. |
close | -- | No direct equivalent exists for this event. |
error | onerror | Fires when an error occurs loading an image or other element, or when a scripting error occurs. |
initialize | onready statechange |
Fires when the page changes from initializing to interactive, and from interactive to loaded. A page is interactive as soon as the user can interact with it by scrolling or clicking on anchors or elements. A page is loaded when all the content has been downloaded. |
load | onload | Fires after the document is loaded and all the elements on the page have been completely downloaded. |
paint | -- | No direct equivalent exists for this event. |
resize | onresize | This Dynamic HTML event functions similarly to its Visual Basic counterpart; however, you do not need to write code to handle resizing of an HTML page as you do a Visual Basic form. Resize in HTML happens automatically. |
scroll | onscroll | Fires whenever the scroll box for the page or any element within it is repositioned. |
terminate | -- | No direct equivalent exists for this event. You can perform terminate-type actions in the onunload event. A terminate event does exist for the DHTMLPage object. This object is not part of the Dynamic HTML object model, and is unique to Visual Basic. |
unload | onunload | Fires immediately prior to the document being unloaded (when navigating to another document). |
In addition, there are some events in Dynamic HTML that do not have equivalents in Visual Basic. A few of the more interesting of these are shown in the following table:
DHTML Event | Usage |
onabort | Fires when the user aborts the download of an image or page element by pressing the Stop button. |
onreset | Fires when the user selects a Reset button on a form. |
onsubmit | Fires when the user selects a Submit button on a form. Can be used to perform validation of data on the client before sending it to the server. |
For More Information See "Events" in the "Document Object Model References" section of the Internet Client SDK for more information on Dynamic HTML events.