Ch18_JS_EVENTS.pdf

18 JAVASCRIPT EVENTS  What is an Event JavaScript's interaction with HTML is handled through events that occur when the user or the browser manipulates a page. When the page loads, it is called an event. When the user clicks a button, that click too is an event. Other exam...

18 JAVASCRIPT EVENTS  What is an Event JavaScript's interaction with HTML is handled through events that occur when the user or the browser manipulates a page. When the page loads, it is called an event. When the user clicks a button, that click too is an event. Other examples include events like pressing any key, closing a window, resizing a window, etc. Developers can use these events to execute JavaScript coded responses, which cause buttons to close windows, messages to be displayed to users, data to be validated, and virtually any other type of response imaginable.  What is an Event Events are a part of the Document Object Model (DOM) and every HTML element contains a set of events which can trigger JavaScript Code.  List of Event When a user visit your website, they do things like click on text and images and given links, hover over things etc. These are examples of what JavaScript calls events. We can write our event handlers in Javascript and can specify these event handlers as a value of event tag attribute. The HTML 4.01 specification defines 19 event attributes as listed below  and Level Events There are attributes which can be used to trigger any javascript code when there is any event occurs on document level.  Level Events There are following six attributes which can be used to trigger any javascript code when there is any event occurs on form level.  Keyboard Events There are following three events which are generated by keyboard. These events are not valid in ( br, frame, frameset, head, html, iframe, meta, param, script, style, and title elements.)  Other Events There following other 7 events which are generated by mouse when it comes in contact of any HTML tag.  onclick Event Type This is the most frequently used event type which occurs when a user clicks the left button of his mouse. You can put your validation, warning etc., against this event type. onclick Event Type Example  onsubmit Event Type onsubmit is an event that occurs when you try to submit a form. You can put your form validation against this event type. Example The following example shows how to use onsubmit. Here we are calling a validate() function before submitting a form data to the webserver. If validate() function returns true, the form will be submitted, otherwise it will not submit the data. onsubmit Event Type Example  onmouseover and onmouseout These two event types will help you create nice effects with images or even with text as well. The onmouseover event triggers when you bring your mouse over any element and the onmouseout triggers when you move your mouse out from that element. Try the following example. onmouseover and onmouseout Example