Showing posts with label events in javascript. Show all posts
Showing posts with label events in javascript. Show all posts

Monday, September 10, 2012

Events example in Javascript

Event Sample



<html>
<b><center>CUSTMER INTERACTION FORM</center></b>
<script languge="Javascript">
function evaluate(form)
{
if(document.forms[0].elements[0].checked="True" && 
 document.forms[0].elements[1].checked="True")
{
var num = prompt("How many children?");
if (num >= 2)
alert("You are eligible for a loan of rs 10000/-");
else
alert("You are eligible for a loan of rs 5000/-");
}
else
document.writeln("<br><h1>Not eligible!!</h1>");
}
</script>
<body>
<form method = post>
Name    : <input type = text><br>
Address : <input type = text><br>
Age     : <input type = text><br>
</form>

<form method = post>
Marital status : <input type = checkbox><br>
Children(y/n) : <input type = checkbox><br>
Evaluate :<input type = "submit" value = "Submit"
onClick ="evaluate(this.form)";
</form>
</body>
</html>

Event Sample in Javascript


Event Sample


<html>
<head>
<script>
//Defining the function to calculate the square 
function calculate(form) {
form.square.value=form.entry.value*form.entry.value
form.cube.value=form.entry.value*form.entry.value*form.entry.value
}
</script>
</head>
<body onload="
var name = prompt('Enter your name','Name');
alert('Hi! + name);">
<form method=post>
Enter a Number : <input type="text" Name="entry" value="0"
onchange="calculate(this.form);">
<br>
square of Number Entered : <input type="text" name="square"
value="0" onfocus="this.blur();">
<br>
cube of number entered : <input type="text" name="cube" value="0"
onfocus="this.blur();">
</form>
</body>
</html>

MouseOver Event Sample in Javascript


MouseOver Event Sample


<HTML>
<HEAD>
<TITLE>mouseOver Event</TITLE>
<H1><MARQUEE >HOW TO LEARN ENGLISH?</MARQUEE></H1>
<SCRIPT LANGUAGE="JavaScript">
function func(s)
{
var str=""
str="You have placed mouse on the alphabet="
str+=s
alert(str)
}
function func1()
{
alert("Place mouse cursor over any alphabet")
}
</SCRIPT>
</HEAD>
<BODY BGCOLOR="CYAN">
<CENTER>
<A HREF=""onClick='return false' onMouseOver='func("A")'onMouseOut='func1()'>A</A>
<A HREF=""onClick='return false' onMouseOver='func("B")'onMouseOut='func1()'>B</A>
<A HREF=""onClick='return false' onMouseOver='func("C")'onMouseOut='func1()'>C</A>
<A HREF=""onClick='return false' onMouseOver='func("D")'onMouseOut='func1()'>D</A>
<A HREF=""onClick='return false' onMouseOver='func("E")'onMouseOut='func1()'>E</A>
<A HREF=""onClick='return false' onMouseOver='func("F")'onMouseOut='func1()'>F</A>
<A HREF=""onClick='return false' onMouseOver='func("G")'onMouseOut='func1()'>G</A>
<A HREF=""onClick='return false' onMouseOver='func("H")'onMouseOut='func1()'>H</A>
<A HREF=""onClick='return false' onMouseOver='func("I")'onMouseOut='func1()'>I</A>
<A HREF=""onClick='return false' onMouseOver='func("J")'onMouseOut='func1()'>J</A>
<A HREF=""onClick='return false' onMouseOver='func("K")'onMouseOut='func1()'>K</A>
<A HREF=""onClick='return false' onMouseOver='func("L")'onMouseOut='func1()'>L</A>
<A HREF=""onClick='return false' onMouseOver='func("M")'onMouseOut='func1()'>M</A>
<A HREF=""onClick='return false' onMouseOver='func("N")'onMouseOut='func1()'>N</A>
<A HREF=""onClick='return false' onMouseOver='func("O")'onMouseOut='func1()'>O</A>
<A HREF=""onClick='return false' onMouseOver='func("P")'onMouseOut='func1()'>P</A>
<A HREF=""onClick='return false' onMouseOver='func("Q")'onMouseOut='func1()'>Q</A>
<A HREF=""onClick='return false' onMouseOver='func("R")'onMouseOut='func1()'>R</A>
<A HREF=""onClick='return false' onMouseOver='func("S")'onMouseOut='func1()'>S</A>
<A HREF=""onClick='return false' onMouseOver='func("T")'onMouseOut='func1()'>T</A>
<A HREF=""onClick='return false' onMouseOver='func("U")'onMouseOut='func1()'>U</A>
<A HREF=""onClick='return false' onMouseOver='func("V")'onMouseOut='func1()'>V</A>
<A HREF=""onClick='return false' onMouseOver='func("W")'onMouseOut='func1()'>W</A>
<A HREF=""onClick='return false' onMouseOver='func("X")'onMouseOut='func1()'>X</A>

<A HREF=""onClick='return false' onMouseOver='func("Y")'onMouseOut='func1()'>Y</A>
<A HREF=""onClick='return false' onMouseOver='func("Z")'onMouseOut='func1()'>Z</A>
</BODY>
</HTML>



















alert Events Sample in Javascript


Events Sample

<HTML>
<HEAD>
<TITLE>JavaScript Events</TITLE>
<SCRIPT LANGUAGE="JavaScript">
function func1()
{
alert('YOU HAVE DOUBLE CLICKED!!!!!!!!!!');
}
</SCRIPT>
</HEAD>
<BODY>
<A HREF="D:\Blessy\JSCRIPT\hello.html" onClick='return false' onDblClick='func1()'>Click This</A>
</BODY>
</HTML>



simple function invocation in Javascript

Javascript tutorial functions


Javascript Events Sample


<HTML>
<HEAD>
<TITLE>JavaScript Events</TITLE>
<SCRIPT LANGUAGE="JavaScript">
num=0
function handler()
{
num++
alert("Number : "+num)
}
</SCRIPT>
</HEAD>
<BODY>
<A HREF="J1.HTML" onMouseOver='handler()' > Place Your Mouse Cursor Over This </A>
</BODY>
</HTML>


MouseUp And mouseDown Events

<html>
<head>
<title>mouseUp And mouseDown Events</title>
<script language="JAVASCRIPT">
function func1()
{
location.href="event1.html"
}
function func2()
{
document.alinkColor="#ff0000"
}
function func3()
{
document.alinkColor="#0000ff"
}
</script>
</head>
<body>
<a href="event1.html" onClick='return false' onDblClick='func1()'
onMouseDown='func2()' onMouseUp='func3()' >Click Me </a> 
</body>
</html>