Event Handling
Event Handling in Javascript

Any html form tag element like textbox,button has some event. Like onclick,onfocus,onblue etc.
We generally call javascript function on those event.
Some usefull event are.
Onclick()
Onfocus()
Onsubmit()
Onchange()
Onload()
Onunload()
Onmouseover()
Onmouseout()

Onclick()

Generally we use onclick() event on button object. We Just call javascript function onclick event.

Example 1:-

<html>
<head>
<title>Javascript Example</title>
<script language="javascript">
function testfunction()
{
alert('welcome');
}
</script>
</head>
<body>
<input name="btn" type="button" onclick="testfunction()" value="Click Here" />
</body>
</html>

Onfocus()

Generally we this event on inputbox like textbox. When click on textbox then event work.

Example 2:-

<html>
<head>
<title>Javascript Example</title>
<script language="javascript">
function testfunction()
{
alert('Please first name');
}
</script>
</head>
<body>
<input name="fname" type="text" onfocus="testfunction()" />
</body>
</html>

Onmouseover()

We generally on hyperlink button. We go over the link then onmouseover event do work means call Javascipt function.

Example 3:-

<html>
<head>
<title>Javascript Example</title>
<script language="javascript">
function testfunction()
{
alert('Mouse is over the link');
}
</script>
</head>
<body>
<a href="#" onmouseover="testfunction()">come here</a>
</body>
</html>

Onload()

This  event  work when page loaded.

Example 4:-

<html>
<head>
<title>Javascript Example</title>
<script language="javascript">
function testfunction()
{
alert('Then function work when page is loaded');
}
</script>
</head>
<body onload="testfunction()">
</body>
</html>

Onsubmit()

When we submit form on the server. Then onsubmit event is validate form.

Example 5:-

<html>
<head>
<title>Javascript Example</title>
<script language="javascript">
function validateform()
{
if(document.frm.fname.value=="")
{
alert('Name must be fill out');
}
}
</script>
</head>
<body>
<form name="frm" onsubmit="validateform()">
Enter Name<input name="fname" type="text" /><br />
<input name="btnsubmit" type="submit" value="Submit" />
</form>
</body>
</html>


Previous
Next