Event Bubbling Demonstration : Target « Event « JavaScript Tutorial






<html onclick="alert('Event is now at the HTML element.')"> 
<head> 
<title>Event Bubbles</title> 
<script type="text/javascript"> 
function init() { 
    window.onclick = winEvent 
    document.onclick = docEvent; 
    document.body.onclick = docBodEvent; 
} 
function winEvent() { 
    alert("window object level."); 
} 
function docEvent() { 
    alert("document object level."); 
} 
function docBodEvent() { 
    alert("BODY element."); 
} 
</script> 
</head> 
<body onload="init()"> 
<form onclick="alert('FORM')"> 
<input type="button" value="Button 'main1'" name="main1" onclick="alert('Button: ' + this.name)" /> 
</form> 
</body> 
</html>








15.6.Target
15.6.1.Get key event target element id
15.6.2.Get mouse event target
15.6.3.Event Bubbling Demonstration
15.6.4.W3C Event Capture and Bubble