<html>
<head><title>Event Handlers Example</title>
<script language="JavaScript">
function DisplayEvent(e){
span = document.getElementById("adhere");
logentry = e.type;
if(e.type=="keypress"){
if(e.keycode)
keycode = e.keyCode;
else
keycode = e.which;
key = String.formCharCode(keycode);
logentry += "key "+key;
}
if(e.type=="mousedown" || e.type=="mouseup" || e.type=="click"){
if(e.button)
button = e.button;
else
button = e.which;
logentry +="button "+button;
}
txt = document.createTextNode(logentry);
span.appendChild(txt);
span.appendChild(document.createElement("BR"));
}
</script></head>
<body onPress="DisplayEvent(event)">
<h1>Event Handlers Example</h1>
<p>Move the mouse in and out of the heading below, or click on it. the events that occur will be listed below.</p>
<h1 style="color:blue" align="center" onMouseOver="DisplayEvent(event)" onMouseOut="DisplayEvent(event)"
onClick="DisplayEvent(event)" onMouseUp="DisplayEvent(event)" onMouseDown="DisplayEvent(event)">
Generate events here </h1>
<b>Event Log:</b><hr><br>
<span ID="adhere"></span>
</body>
</html>
OUTPUT
No comments:
Post a Comment