/*
JavaScript Bible, Fourth Edition
by Danny Goodman
John Wiley & Sons CopyRight 2001
*/
W3C DOM Event Propagation
function init() {
// using old syntax to assign bubble-type event handlers
window.onclick = winEvent
document.onclick = docEvent
document.body.onclick = docBodEvent
// turn on click event capture for two objects
document.addEventListener("click", docEvent, true)
document.forms[0].addEventListener("click", formCaptureEvent, true)
// set event listener for bubble
document.forms[0].addEventListener("click", formBubbleEvent, false)
}
function winEvent(evt) {
alert("Event is now at the window object level (" + getPhase(evt) + ").")
}
function docEvent(evt) {
alert("Event is now at the **document** object level (" + getPhase(evt) + ").")
}
function docBodEvent(evt) {
alert("Event is now at the BODY level (" + getPhase(evt) + ").")
}
function formCaptureEvent(evt) {
alert("This alert triggered by FORM only on CAPTURE.")
}
function formBubbleEvent(evt) {
alert("This alert triggered by FORM only on BUBBLE.")
}
// reveal event phase of current event object
function getPhase(evt) {
switch (evt.eventPhase) {
case 1:
return "CAPTURING"
break
case 2:
return "AT TARGET"
break
case 3:
return "BUBBLING"
break
default:
return ""
}
}
W3C DOM Event Propagation