Event Handling with JavaScript in ASP.Net

The dynamic content or style modifications happen when the user triggers an action on a web page. This is achieved through events on the HTML elements. Many events can occur on a web page—for example, when you are moving the mouse over an HTML element, an onmouseover event is fired. When a button is clicked, an onclick event is fired. You can have these events handled through JavaScript code. The good thing is all the basic events are handled quite similarly among different browsers. Here is a small example showcasing the onclick event and its handler:

<input type=button id=btnDisplay value=Display onclick=alert(‘Button click event is fired !’);/>

The HTML button btnDisplay has an attribute, onclick, which is an event fired whenever the button is clicked. Note that you can write your JavaScript code inline—that is, by placing the code directly inside the onClick attribute of a button or, even in a function, referred to as an event handler because it is associated with a particular event. But, what are event handlers? An event is associated with its corresponding event handler—a function that is triggered when the event is fired. As an example, you can associate an event handler to the onClick event that actually does some processing, such as form validations, calculations, and so on.

Common event handlers:

onClick : Occurs when you click an element

onSubmit : Occurs when you submit a form and prior to the same being processed

onReset : Occurs when you reset a form

onFocus : Occurs when you bring an element to focus

onBlur : Occurs when the focus on an element is lost

onMouseOver : Occurs when you move the mouse over an element

onMouseOut : Occurs when you mouse off an element

onMouseMove : Occurs when you move the mouse

onChange : Occurs when you change the value in a text, a text area, or a select field

onSelect : Occurs when you select a portion of text in a text or a text area element

onResize : Occurs when you resize the browser window or the frame

onMove : Occurs when you move the browser window or the frame

onLoad : Occurs when the page has finished loading

onUnload Occurs when you exit off a page

onError : Occurs when an error has occurred due to a fault in loading an image or a document

onAbort : Occurs when you stop an image while it is loading

Onkeydown : Occurs when you press a key

Onkeyup : Occurs when you release a key

Onkeypress : Occurs when the onkeydown event is followed by the onkeyup event