JAVASCRIPT

OnReset, OnResize and Other JavaScript Events

In our last tutorial we left off with the mouse events. We’ll be wrapping up the series on JavaScript events in this part. It’s been a long ride, but by the end of this article you should be able to create some nifty dynamic web pages. When Google buys your nerd-infested web site, don’t forget the guy who got you there.

Author Info:

By: James Payne

Poor Best

Rating:

/ 3

December 17, 2007

TABLE OF CONTENTS:

· OnReset, OnResize and Other JavaScript Events
· OnResize
· OnSelect
· OnSubmit
· OnUnLoad

Event	What Triggers the Event
OnAbort	Occurs when the loading of an image is interrupted
OnBlur	Occurs when an element loses focus
OnChange	Occurs when the user changes the content of a field
OnClick	Occurs when the user clicks an object
OnDblClick	Occurs when the user double clicks an object
OnError	Occurs when an error occurs while loading a document or an image
OnFocus	Occurs when an element has focus
OnKeyDown	Occurs when a keyboard key is pressed
OnKeyPress	Occurs when a keyboard key is pressed or held down
OnKeyUp	Occurs when a keyboard key is released
OnLoad	Occurs when a page or image has completed loading
OnMouseDown	Occurs when a mouse button is pressed
OnMouseMove	Occurs when the mouse is moved
OnMouseOut	Occurs when the mouse is moved off of an element
OnMouseOver	Occurs when the mouse is moved over an element
OnMouseUp	Occurs when the mouse button is released
OnReset	Occurs when the reset button is clicked
OnResize	Occurs when a window or frame is resized.
OnSelect	Occurs when text is selected
OnSubmit	Occurs when the submit button is clicked
OnUnload	Occurs when the user exits the page

OnReset

This nifty little fellow is triggered when you click the Reset button on a form. In the following example, we create a form asking for the user’s first and last name. The fields have a default value of Chuck and Norris respectively. When the user enters their data and clicks the Reset button, a pop-up alert appears with the text: You fool! You reset the form! Then, the original values of the two text fields are returned. Want to see that in code? Here it be:

<html>

<body>

First Name: <input type="text" name="firstname" value="Chuck" />

<br />

Last Name: <input type="text" name="lastname" value="Norris" />

</form>

</body>

</html>

Supporting HTML tags: <form>

Supporting Javascript Objects: form

Next: OnResize >>