Events can be detected by the browser.
·
Events are generated when the user performs a particular
action.
·
Events are generally associated with the
functions so that the code(logic) present in the function will be executed when
the specified event occurs.
·
The various java script events are:
1.
onclick:
2.
ondblckick
3.
onkeydown
4.
onkeyup
5.
onkeypress
6.
onmousedown
7.
onmouseup
8.
onousemove
9.
onmouseover
10.
onmouseout
11.
onfocus
12.
onblur
13.
onsubmit
14.
onreset
15.
onchange
16.
onerror
onload1. onclick:
This event is generated when the user clicks on a button
2. ondblclick:
this event is generated when the user double clicks on
3. onkeydown:
this event is generated when the user presses a key and the key is not yet released
4. onkeyup:
this event is generated when the user releases a key
5. onkeypress:
this event is generated when a key pressed and released.
6. onmousedown:
this event is generated when the user presses the mouse button and it is not released.
7. onmouseup:
this event is generated when the user releases the mouse button
8. onmousemove:
this event is generated when the mouse pointer location is changed.
9. onmouseover:
this event is generated when the mouse pointer is placed on top of a text(or) image
10. onmouseout:
this event is generatd when the mouse pointer is removed from a top of a text (or) image.
11. onfocus:
this event is generated when an input element contains focus (i.e having control)
12. onblur:
this event is generated when the focus is lost
13. onsubmit:
this event is generated when the submit button is clicked
14: onreset:
this event is generated when the reset button is clicked
15. onchange:
when there is a change in the values of the input elemntes
16. onerror:
when an error occurs in th edocument.
17. onload:
this event is generated when a docuement is loaded on to the browser.
18. onunload:
this event is generated when the document is unloaded from the browser.
19. onresize:
this event is generated when there is a change in the size of the window (or) Frame.
<html>
<head>
<script type="text/javascript">
function change()
{
var name=myform.user.value;
var color=myform.col.value;
document.bgcolor=color;
alert(name+"has changed the bg color to"+color);
}
</script>
</head>
<body>
<form name="myform">
username<input type="text" name="user"/><br/>
Color<input type="text" name="Id"/> <br/>
<input type="button" value="change"
onclick=change();
</form>
</body>
</html>
<html>
<head>
<title> Login page</title>
<script type="text/javascript">
function validate(loginform)
{
var user=loginform.uname.value;
var pass=loginform.prod.value;
if(user.length==0)
{
alert("enter your name");
loginform.uname.focus();
return false;
}
if(pass.length==0)
{
alert("enter your password");
loginform.pwd.focus():
return false;
}
}
</script>
</head>
<body>
<center>
<h1>login page</h1>
<form name="loginform"
onsubmit="return validate<this)">
username<input type="text" name="uname"/><br/>
password<input type="passowrd" name="pwd"/>
<br/>
<input type="submit" value="login" />
</form>
</center>
</body>
</html>
output
we can write the javascript code within the html document(internal javascript code) or external to the html document(External javascript code)
No comments:
Post a Comment