Revision: 9355
Initial Code
Initial URL
Initial Description
Initial Title
Initial Tags
Initial Language
at November 1, 2008 08:42 by sandel
Initial Code
<html onclick="revealEvent('html',event)">
<head>
<title>Event Cancelling & Redirecting</title>
<script type="text/javascript">
<!--
//window.onload=init;
// display alert with event object info
function revealEvent(elem,evt) {
evt = (evt) ? evt : ((window.event) ? window.event : "")
if (evt) {var elemx = (evt.target) ? evt.target : evt.srcElement;}
var elemv = (evt.currentTarget) ? evt.currentTarget.nodeName : document.activeElement.tagName;
var msg="Event (from "+elemx.tagName+" | "+elemv+" at ";
msg += evt.clientX+","+evt.clientY+") is now at the <";
msg += elem+"> element.";
alert (msg);
}
function init(){
document.onclick = docEvent;
document.body.onclick = docBodEvent;
}
function docEvent(e) {
revealEvent("document",e);
}
function docBodEvent(e) {
revealEvent("Body",e)
}
function buttonEvent(form,e){
revealEvent("button",e);
// cancel if checked (ie4+)
e.cancelBubble = form.bubbleCancelState.checked;
// redirect if checked (ie5.5+)
if (form.redirect.checked) {
document.body.fireEvent("onclick",e);
}
}
//-->
</script>
</head>
<body onload="init()" >
<h1>Event Cancelling & Redirecting</h1>
<hr/>
<form onclick="revealEvent('form',event)">
<p><button name="main1" onclick="buttonEvent(this.form,event)">Button 'main1'</button></p>
<p>
<input type="checkbox" name="bubbleCancelState" onclick="event.cancelBubble=true" />Cancel Bubbling at button<br/>
<input type="checkbox" name="redirect" onclick="event.cancelBubble=true" />Redirect Event to body
</p>
</form>
</body>
</html>
Initial URL
Initial Description
Initial Title
event bubble Classic Example
Initial Tags
event
Initial Language
JavaScript