Exp 7
Exp 7
7
Aim : Create a web page to implement form events. ( Mouse Events)
Theory:
An event is an action performed by user. A JavaScript executes in response to an event that occurs while a
form is displayed on the screen. An event can be clicking on a button, selecting a radio button or moving
the cursor on an element or away from an element on a form. Browser also fires event when a page loads or
unloads. An event is associated with an element of a form as an attribute defined within the opening tag of
the element.
Events:
onload event : This event occurs when browser loads a web page / frames on the display. It is used with
opening body tag.
Example: <body onload=”function( ) ”></form>
onunload event : This event occurs when a browser removes a document from a window or frame. It is used
with opening body tag.
Example: <body onunload=”function( ) ”></form>
onsubmit event : This event occurs when a form is submitted on a web page. It is used with opening form
tag.
Example : <form onsubmit=”function( )”></form>
onreset event : This event executes when a form is reset. It is used with opening form tag.
Example : <form onreset=”function( )”></form>
onselect event : This event executes when a text is selected from a text field. It is used with form elements.
Example : <input type=”text” onselect=”function( )”>
onchange event : This event executes when an element looses input focus and the value of the elements has
changed. It is used with form elements.
Example : <input type=”text” onchange=”function( )”>
onfocus event : This event executes when an element receives focus ( when an event becomes active).
Example: <input type=”text” onfocus=”function( )”>
onblur event : This event executes when an element looses focus (when control passes from one element to
another element.
Example : <input type=”text” onblur=”function( )”>
Mouse Events:
onclick event : This event occurs when a mouse button is click on or over a form element.
Example : <input type=”text” onclick=”function( )”>
ondblclick event : This event occurs when a mouse button is double click on or over a form element.
Example : <input type=”text” ondblclick=”function( )”>
onmousedown event : This event executes when a mouse button is clicked while cursor is over an element.
Example : <input type=”text” onmousedown=”function( )”>
onmouseup event : This event executes when a mouse button is released while the cursor is over an
element.
Example : <input type=”text” onmouseup=”function( )”>
onmouseover event : This event executes when mouse cursor moves onto an element.
Example : <input type=”text” onmouseover=”function( )”>
onmousemove event : This event executes when mouse cursor is moved while over an element.
Example : <input type=”text” onmousemove=”function( )”>
onmouseout event : This event executes when mouse cursor is moved away from an element.
Example : <input type=”text” onmouseout=”function( )”>
Programs:
Write HTML code along with JavaScript code for functions called using mouse events.
Also attach output for the same.
conclusion:
With all general and mouse events, form validations are successfully implemented.