Working with Events in JavaScript

Event and event handlers are very important for JavaScript programming, Event occurs when user performs any action on HTML document. For example, if user clicks on a button a click event occurs. If mouse point moves across a link, then MouseOver event occurs, an HTML page loads, Load event occurs

Event handlers are JavaScript methods, i.e. functions that allow us as JavaScript programmers to control what happens when events occur. Following event handlers are used in JavaScript.

onBlur
It is used when form elements, window or frame loses focus. It is applied on text field, textareas, password fields, window, frame, buttons, images etc.

onChange
onChange handler is used when user changes form elements, for example, when user changes <select> element, OnChange event will occur.

		<form>
        <select onChange="alert('OnChange Eventt Occurs')">
            <option>Red</option>
            <option>Green</option>
            <option>Blue</option>
            <option>White</option>
           </select>
       </form>

Red Green Blue White

onClick
onClick handler is executed when user clicks any object like buttons, images or text links using mouse. It is commonly applies on links, form buttons, list boxes, checkboxes and images.

<form>
<input type="button" value="Click me" onClick="alert('You have clicked me')">
</form>

onDbClick
onDbClick handler is executed when user Double clicks on any object like buttons, images or text links using mouse.

onFocus
It is used when form elements, window or frame gains focus. It is applied on text field, textareas, password fields, window, frame, buttons, images etc

onKeydown
onKeyPress handler is executed when user presses a key.

onKeyup
onKeyup handler is executed when user releases a key.

onKeypress
onKeyPress handler is executed when user presses a key or holds down a key.

onLoad
onLoad handler is executed when a page or image has finished loading. the onLoad event is commonly used on popup windows or webpages.

onMousedown
This event is occured when user depresses a mouse button.

onMouseUp
This event is occured when user releases a mouse button.

onMouseover
onLoad handler is executed when user moves the mouse over the object.

onMousemove
This event handler is occured when user moves a mouse cursor.

onMouseout
This event handler is occured when mouse cursor leaves an area or link.

onReset
This event handler is occured when user user resets a form.

onSelect
This event handler is used when user selects some text in text area or text field..

onSubmit
onSubmit handler is executed when a user submits a form, the purpose of onSubmit event is submit a form after validation.

onUnload
onLoad handler is executed when user leaves webpages

Bookmark This Page