Was ist ein sprudelndes Ereignis?
Das heißt, wenn mehrere Divs verschachtelt sind, wird eine Eltern-Kind-Beziehung hergestellt. Wenn das übergeordnete Div und das untergeordnete Div das Onclick-Ereignis des untergeordneten Divs auslösen, führt das untergeordnete Div das entsprechende aus js-Operation. Aber auch das Onclick-Ereignis des übergeordneten Div wird ausgelöst. Dies führt zu mehreren Ebenen der Parallelität von Ereignissen und führt zu Seitenchaos. Das ist ein sprudelndes Ereignis.
So beseitigen Sie Blasenereignisse
Verhindern, dass JavaScript-Ereignisse sprudeln (cancelBubble, stopPropagation)
Der folgende Code kann sehr gut erklären, was der Blaseneffekt ist und was die Beseitigung des Blaseneffekts ist.
Kopieren Sie den Codecode wie folgt:
<html>
<Kopf>
<title> Verhindern Sie, dass JavaScript-Ereignisse sprudeln (cancelBubble, stopPropagation)</title>
<meta name="keywords" content="JavaScript, Event-Bubbling, cancelBubble, stopPropagation" />
<script type="text/javascript">
Funktion doSomething (obj,evt) {
alarm(obj.id);
var e=(evt)?evt:window.event; //Bestimmen Sie den Browsertyp und verwenden Sie cancelBubble in Browsern, die auf dem IE-Kernel basieren
if (window.event) {
e.cancelBubble=true;
} anders {
//e.preventDefault(); //Unterstützt die stopPropagation-Methode in Browsern, die auf dem Firefox-Kernel basieren
e.stopPropagation();
}
}
</script>
</head>
<Körper>
<div id="parent1" onclick="alert(this.id)">
<p>Dies ist parent1 div.</p>
<div id="child1" onclick="alert(this.id)">
<p>Das ist Kind1.</p>
</div>
<p>Dies ist parent1 div.</p>
</div>
<br />
<div id="parent2" onclick="alert(this.id)">
<p>Dies ist parent2 div.</p>
<div id="child2" onclick="doSomething(this,event);">
<p>Das ist child2. Will bubble.</p>
</div>
<p>Dies ist parent2 div.</p>
</div>
</body>
</html>
Wenn Sie nach dem direkten Kopieren des Codes auf „Kind1“ klicken, wird nicht nur das Dialogfeld „Kind1“ angezeigt, sondern auch das Dialogfeld „Eltern1“.
Das ist das sprudelnde Ereignis
Wenn Sie jedoch auf chile2 klicken, wird nur child2 angezeigt, nicht jedoch parent2. Dies ist der Effekt der Anwendung von Spezialeffekten, die Blasenereignisse verhindern.