By using JavaScript, we have the ability to create dynamic web pages. Events are actions that can be detected by JavaScript.
Every element on a web page has certain events which can trigger JavaScript functions. We define the events in the HTML tags.
Event handlers are not added inside the <script> tags, but rather, inside the html tags, that execute the JavaScript when something happens, such as pressing a button, moving mouse over a link, submitting a form.
Basic syntax of event handlers is:
name_of_the_handler = "JavaScript code"
Example:
<a href="www.google.com" onClick="alert("hello")">Google</a>
when user clicks on the link, it will prompt an alert box before being taken to Google.
Some of the most commonly supported eventhandlers:
onClick -- Invokes JavaScript upon clicking (a link, or form boxes)
onLoad -- Invokes JavaScript after the page or an image has finished loading
onMouseover -- Invokes JavaScript if the mouse passes by some link
onMouseout -- Invokes JavaScript if the mouse goes pass some link
onUnload -- Invokes JavaScript right after someone leaves this page
OnClick Event Handler: OnClick event handler is executed when an element is clicked. It can only be added to visible elements on the page such as <a>, form buttons, check boxes, a DIV etc.
OnLoad Event Handlers This is used to call the execution of JavaScript after a page, frame or image has completely loaded.
onMouseover, onMouseout
onMouseover and onMouseout event handleres can be added to visible elements such as a link (<a>), DIV, even inside the <BODY> tag, and are triggered when the mouse moves over and out of the element.
onMouseover and onMouseout events are often used to create "animated" buttons.
onUnload Event Handler onunload executes JavaScript immediately after someone leaves the page.
Applicability of Event Handlers
onAbort ---<img> tags
onBlur --- window object, all form objects
onClick---Most visible elements such as <a>, <div>, <body>
onChange---Use this to invoke JavaScript if mouse goes pass some link
onError --- Text fields,Text Areas
onFocus---Most visible elements such as <a>, <div>, <body>
onLoad---<body>, <img>, and <frame>
onMouseover---Most visible elements such as <a>, <div>, <body>
onMouseout---Most visible elements such as <a>, <div>, <body>
onReset --- <form> tag, triggered when the form is resent via <input type="reset">
onSelect --- Elements with textual content. Most commonly used inside text fields and text areas
onSubmit --- <form> tag, triggered when the form is submitted
onUnload --- <body>---Most visible elements such as <a>, <div>, <body>
The Onload event is often used to check the visitor's browser type and browser version, and load the proper version of the web page based on the information.
onFocus, onBlur and onChange
These events are often used in combination with validation of form fields.
OnSubmit
onSubmit event is used to validate All form fields before submitting it.
http://www.sigmainfo.net
ReplyDelete