11.JavsScript Events

Javascript Events

1.onLoad and onUnload
2.onFocus, onBlur, and onChange
3.onSubmit
4.onMouseOver and onMouseout
5.onClick

Events are actions that can be detected by JavaScript
By using JavaScript, we have the ability to create dynamic web pages

Examples of events:

1. A mouse click
2.A web page or an image loading
3.Mouseing over a hot spot on the web page
4. selecting an input field in an HTML form
5.submitting an HTML form

Events are normally used in combination with funactions, and the function will not be executed before the event occures!

onLoad and onUnload

The onLoad and onUnload events are triggered when the user enters or leaves the page.

The onLoad event is often used to check the visitor's browser type and browser version and load the propar version of the web page based on the information.

Both the onLoad and onUnload events often are used to deal with cookies that should be set when a user enters or leaves a page.

onFocus,onBlur, and onChange

The onFocus,onBlur, and onChange

The onFocus,onBlur,and onChange events are often used in combination with validation of form fields.

The onFocus and onBlur events are complementary and are caused by the user clicking outside of the current window, frame, or form element or using the tab key to move among fields or elements.

when the user leaves an element, that element triggers a blur event.

when the user moves to a new element, that element triggers a focus event

<input type="text" size="30" id="email" onChange="checkEmail()">

onSubmit

The onSubmit event may be used to validate from fields before submitting the form.

Because the programmers controls the function executed on onSubmit, he can validate any,all, or no inputs as he sees fit.

<form method="post" action="xxx.htm" onsubmit="returncheckForm()">

onMouseOver and onMouseOut

onMouseOver and onMouseOut often are used to create Rollover buttons.

<a href="http://www.w3schools.com" onmouseover="alert('An onmouseover event'); return fals">
<img src="w3s.gif" alt="w3schools"/></a>

onClick

The onClick event occurs when the user mouse clicks on a visible element on the screen.

<input type="button" name="language" value="Click for spanish" onClick="translate()">

No comments:

My Favorite Books

  • C and Data Structures by Ashok N. kamthane
  • Web Technologies by A. A. Puntambekar
  • Learn HTML and CSS with W3Schools
  • Learn JavaScript and Ajax with W3Schools
  • HTML5 Black Book: Covers Css3, Javascript,XML, XHTML, Ajax, PHP And Jquery
  • HTML5 Application Development Fundamentals: MTA Exam 98-375
  • .NET 4.0 Programming 6-In-1, Black Book
  • SQL Server 2008 R2 Black Book
  • Asp.net 4.0 Projects Covers: net 3.5 And .net 4.0 Codes, Black Book
  • UNIX Shell Programming 1 Edition by Yashavant Kanetkar
  • UNIX and Shell Programming 1 Edition by Richard F. Gilberg, Behrouz A. Forouzan
  • Computer Networks by Andrew S. Tanenbaum
  • Multiple Choice questions in computer science by Timothy J Williams