Einführung in Methoden zur Verhinderung von Blasenereignissen in jQuery_jquery

1. Einführung in sprudelnde Ereignisse

Wenn wir auf ein Steuerelement klicken und das übergeordnete Steuerelement, einschließlich dieses Steuerelements, ebenfalls über ein Klickereignis verfügt, wird die Ausführung fortgesetzt.
Beispiel: a unter dem div hat ein Klickereignis. Wenn auf a geklickt wird, wird eine Warnung zweimal angezeigt. Dieses Phänomen wird als Bubbling-Ereignis bezeichnet.

Dieses Ereignis sprudelt vom ursprünglichen Element an die Spitze des DOM-Baums.
Zielelement: Das Zielelement jedes Ereignisses ist das erste Element, in unserem Beispiel die Schaltfläche
, und es erscheint als Attribut in unserem Elementobjekt. Mithilfe eines Ereignis-Proxys können wir einem Element einen Ereignishandler hinzufügen,
darauf warten, dass ein Ereignis aus seinen untergeordneten Elementen hervortritt, und wir können leicht erkennen, von welchem ​​Element das Ereignis ausgegangen ist.
Hinweis:
Unschärfe, Fokussierung, Laden und Entladen können nicht wie bei anderen Ereignissen sprudeln. Tatsächlich können Unschärfe und Fokus durch die Ereigniserfassung anstelle des Ereignis-Bubblings erreicht werden (in anderen Browsern als dem IE).

2. Verhindern Sie, dass jQuery-Ereignisse sprudeln

jQuery verfügt über eine Bubbling-Funktion zum Auslösen von DOM-Ereignissen. Manchmal kann die Nutzung dieser Funktion die Duplizierung von Code reduzieren, aber manchmal möchten wir verhindern, dass Ereignisse in die Luft sprudeln. Zu diesem Zeitpunkt muss verhindert werden, dass jQuery.Event sprudelt.

Am Anfang des jQuery.Event-Dokuments haben wir erfahren, dass das jQuery.Event-Objekt ein Ereignisobjekt ist, das dem W3C-Standard entspricht. Gleichzeitig macht jQuery.Event eine Überprüfung der Kompatibilität mit dem IE überflüssig.
jQuery.Event bietet eine sehr einfache Möglichkeit, das Sprudeln von Ereignissen zu stoppen: event.stopPropagation();

Code kopieren Der Code lautet wie folgt:

$("p").click(function(event){
event.stopPropagation();
// etwas tun
})

Aber diese Methode hat keine Auswirkung auf Ereignisse, die über Live gebunden sind. Es ist eine einfachere Methode erforderlich, um zu verhindern, dass das Ereignis sprudelt: return false;

Code kopieren Der Code lautet wie folgt:

$(this).after("Noch ein Absatz!");

return false; });

Kompatibel mit mehreren Browser-Beendigungs-Bubbling-Funktionen:

Code kopieren Der Code lautet wie folgt:

function stopDefault(e) {
//Blockieren Sie die Standardbrowseraktion (W3C)
if (e && e.preventDefault)
Die Standardaktionsmethode des Browsers
else
Fenster .event.returnValue = false;
return false;
}

3. Verwenden Sie das Attribut event.tatget, um das Ereignisobjekt zu verdeutlichen

Die Variable event im Event-Handler enthält das Event-Objekt. Das Attribut event.tatget speichert das Zielelement, in dem das Ereignis aufgetreten ist. Dieses Attribut ist in der DOM-API angegeben, wird jedoch nicht von allen Browsern implementiert. jQuery nimmt die notwendigen Erweiterungen an diesem Ereignisobjekt vor, damit diese Eigenschaft in jedem Browser verwendet werden kann. Mithilfe von .target können Sie das Element im DOM ermitteln, das das Ereignis zuerst empfangen hat. Darüber hinaus wissen wir, dass sich dies auf das DOM-Element bezieht, das das Ereignis verarbeitet.

Verwenden Sie das Attribut event.tatget, um das Ereignisobjekt zu verdeutlichen

Der Code zur Verhinderung von Event-Sprudeln lautet wie folgt:

Kopieren Sie den CodeDer Code lautet wie folgt:

$ (document).ready(function() {
$('switcher').click(function(event){
if(event.target == this)
{
$('switcher .button').toggleClass('hidden');
      }
     };)
});