DHTML Events

DHTML Events

An incident which occurs in a particular place during a particular interval of time.

 

EVENT HANDLING
Events are represented by an event object as a member variable of the window object, such as window.event or whether as a parameter to your function

Event handlers are Javascript code that are not include inside the <script> tags, but rather, inside the html tags, that execute Javascript when some events fire, such as pressing a button, moving your mouse over a link, submitting a form, etc.

The basic syntax of these event handlers is : name_of_handler=”JavaScript code here”

For example:

<a onclick=”alert(‘Hello World!’)” href=”javascript:;” class=”link”>Click Here</a>

OUTPUT:

Click Here

Event Functions:

onclick:
The onclick: Event is used to invoke Javascript upon clicking a link or form boxes as in the below example:
<form name=”myformalert”>
<input onclick=”alert(‘hello World’)” type=”button” value=”Click me” name=”test” class=”link” >
</form>

OUTPUT

Clicking the above button invokes the alert function. The event handler is added within the event that it handles, like the the form button event tag.

onload:
The onload: function invokes Javascript after the page has finished loading. The below example loads a webpage, then closes it after the image has finished downloading.
<body onload=”alert(‘hello World’)”>

Displays an alert box when the page has finished loading.

onmouseover:

The onmouseover: function is used to invoke Javascript when the mouse passes over a link.
<a onmouseover=”status=’You activated this message when you moused over the link!’;return true” onmouseout=”status=’ ‘” href=”javascript:;” class=”link”>
Mouse over this link and look the status bar message.
</a>

OUTPUT:

Mouse over this link and look the status bar message.

Common Event Handlers:

Given below is a list of common Javascript event handlers:

Event

Occurs when…

onabort a user aborts page loading
onblur a user leaves an object
onchange a user changes the value of an object
onclick a user clicks on an object
ondblclick a user double-clicks on an object
onfocus a user makes an object active
onkeydown a keyboard key is on its way down
onkeypress a keyboard key is pressed
onkeyup a keyboard key is released
onload a page is finished loading.
onmousedown a user presses a mouse-button
onmousemove a cursor moves on an object
onmouseover a cursor moves over an object
onmouseout a cursor moves off an object
onmouseup a user releases a mouse-button
onreset a user resets a form
onselect a user selects content on a page
onsubmit a user submits a form
onunload a user closes a page
Here below the parameters in which they can be used

Handlers

onAbort
onBlur
onClick
onChange
onError
onFocus
onLoad
onMouseover
onMouseout
onReset
onSelect
onSubmit
onUnload

Can be used with these tags:

images
windows, all form elements, frames
buttons, radio buttons,checkboxes, submit buttons, links
text fields, textareas, select lists
windows, images
windows, frames, and all form elements
body, images
areas, links
links
forms
text fields, textareas
submit button
body

DOWNLOAD SOLUTION HERE