What is event handling in java script?

Answer 1

Event handling is when an action from the user triggers a JavaScript function. An event handler is defined as the following:

onclick="alert('You clicked me!');">Click me!

This will open an alert box with the message You clicked me! displayed in it when the user clicks the div element.

There are many event handlers in JavaScript. Some common ones include:

• onclick (triggered when user clicks the element)
• onload (triggered when page, image, etc. loads)
• onfocus (triggered when element gains focus (becomes active))
• onblur (triggered when element loses focus)
• onmouseover (triggered when user's mouse pointer enters the element)
• onmouseout (triggered when user's mouse pointer leaves the element)
• onmousemove (triggered when user's mouse pointer is moved while it is on top of the element)
• onkeydown (triggered when user presses a key on the keyboard)
• onkeyup (triggered when user releases a key on the keyboard)
• onkeypress (triggered when user presses, then releases a key on the keyboard)

I would recommend you look some of these up and find out more.

Event handlers can be applied as HTML attributes as shown above, or they can be applied during JavaScript execution, as shown below.

In Netscape-based browsers (Firefox, Google Chrome, etc.):

var myHTMLElement=document.getElementById("myElement");

myHTMLElement.onclick="You clicked me!"

Or:

var myHTMLElement=document.getElementById("myElement");

myHTMLElement.addEventListener("click",function (){alert("You clicked me!");});

Note that when using addEventListener, remove the "on" from the event name to get the first parameter. For example, "onload" becomes "load". Also, you can remove this event handler with removeEventListener using the same parameters as addEventListener.

In internet Explorer (prior to version 9):

var myHTMLElement=document.getElementById("myElement");

myHTMLElement.attachEvent("onclick",function (){alert("You clicked me!");});

In Internet Explorer 9, you can use the method you used for Netscape-based browsers. Also, you can remove this event handler with detachEvent using the same parameters as attachEvent.

I would encourage you to find out more about event handlers by searching Google.