JavaScript For Pros: Event Handlers Example of onAbort Event Handler Example of onBlur Event Handler | WebReference

JavaScript For Pros: Event Handlers Example of onAbort Event Handler Example of onBlur Event Handler

JavaScript Event Handlers

JavaScript for Pros

by Reaz Hoque ([email protected])

An event handler executes a segment of a code based on certain events occurring within the application, such as onLoad or onClick. JavaScript event handers can be divided into two parts: interactive event handlers and non-interactive event handlers. An interactive event handler is the one that depends on user interaction with the form or the document. For example, onMouseOver is an interactive event handler because it depends on the user's action with the mouse. An example of a non-interactive event handler is onLoad, as it automatically executes JavaScript code without the need for user interaction. Here are all the event handlers available in JavaScritpt.

Event Handler Used In
onAbort  
onBlur
onChange
onClick
onError
onFocus
onLoad
onMouseOver
onMouseOut
onSelect
onSubmit
onUnload
image
select, text, text area
select, text, textarea
button, checkbox, radio, link, reset, submit, area
image
select, text, testarea
windows, image
link, area
link, area
text, textarea
form
window

onAbort:
An onAbort event handler executes JavaScript code when the user aborts loading an image.

See Example:

<title> Example of onAbort Event Handler </title><h3> Example of onAbort Event Handler: </h3> <b>Stop the loading of this image and see what happens:</b><br/><br/><img src="https://rhoque.com/rhoque.jpg" mce_src="https://rhoque.com/rhoque.jpg" onabort="alert('You stopped the loading the image!')"/>

 

Here, an alert() method is called using the onAbort event handler when the user aborts loading the image.

onBlur:
An onBlur event handler executes JavaScript code when input focus leaves the field of a text, textarea, or a select option. For windows, frames and framesets the event handler executes JavaScript code when the window loses focus. In windows you need to specify the event handler in the <BODY> attribute. For example,

<BODY BGCOLOR='#ffffff' onBlur="document.bgcolor='#000000'">

Note: On a Windows platform, the onBlur event does not work with <FRAMESET>.

See Example:

&lt;title&gt; Example of onBlur Event Handler &lt;/title&gt;&lt;mce:script language="JavaScript"&gt;&lt;!-- function valid(form){ var input=0; input=document.myform.data.value; if (input&lt;0){ alert("Please enter a value that is less than 0"); } } // --&gt;&lt;/mce:script&gt;&lt;h3&gt; Example of onBlur Event Handler: &lt;/h3&gt; Try entering a value less than zero:&lt;br/&gt;