Event bubbling in JavaScript

1. Concept

Event bubbling: If element A is nested in element B, then a is clicked not only A's OnClick event will be triggered, and the onclick of B will also be triggered. The order of triggering is "from inside Out".

2. Cancel Event bubbling

Google, IE

Window.event.cancelBubble = true;

Firefox

E.stoppropagation ();

Example code:

<! doctype html public  "-//w3c//dtd html 4.01 transitional//en"   "HTTP// Www.w3.org/TR/html4/loose.dtd ">
One (Firefox does not support Window.event.cancelBubble)
650) this.width=650; "src=" Http://s4.51cto.com/wyfs02/M00/86/A0/wKioL1fF1tKyY9gjAAFLef7j20k719.gif "title=" bubble _firefox.gif "alt=" Wkiol1ff1tkyy9gjaaflef7j20k719.gif "/>
II (IE)
650) this.width=650; "src=" Http://s2.51cto.com/wyfs02/M01/86/A0/wKiom1fF1tygOLnxAADrTdLwZ5Q611.gif "title=" bubble _ie.gif "alt=" Wkiom1ff1tygolnxaadrtdlwz5q611.gif "/>



Sample code
<! doctype html public  "-//w3c//dtd html 4.01 transitional//en"   "HTTP// Www.w3.org/TR/html4/loose.dtd ">
650) this.width=650; "src=" Http://s4.51cto.com/wyfs02/M01/86/A0/wKiom1fF146ByGYPAAEW2fbPjmI657.gif "title=" bubble _srcelement.gif "alt=" Wkiom1ff146bygypaaew2fbpjmi657.gif "/>

Again, this represents the event that is currently being monitored.
Event.srcelement is the object that raised the event (bubbling)




Event bubbling in JavaScript