Ausführliche Erläuterung der JS-Propagierung von Ereignissen, der Aufhebung des Standardverhaltens von Ereignissen und der Verhinderung der Ereignisweitergabe

In diesem Artikel wird JS hauptsächlich zur Weitergabe von Ereignissen, zum Aufheben des Standardverhaltens von Ereignissen und zur Verhinderung der Ereignisweitergabe vorgestellt. Der detaillierte Vorgang wird anhand der Rückgabewert-Aufrufsequenz des Programms Ereignisverarbeitung erläutert Interessierte an JS können sich auf diesen Artikel beziehen

1 Der Rückgabewert des Event-Handlers

Normalerweise ist der Rückgabewert false Der Browser führt die mit diesem Ereignis verknüpfte Standardaktion nicht aus. Beispielsweise kann der Onclick-Ereignishandler der Schaltfläche zum Senden des Formulars verhindern, dass der Browser das Formular sendet, indem er „false“ zurückgibt, und der Onclick-Ereignishandler des a-Tags kann das Springen zur href-Seite verhindern, indem er „false“ zurückgibt. Ebenso kann der onkeypress-Ereignishandler im Eingabefeld Tastatureingaben filtern, indem er „false“ zurückgibt, wenn der Benutzer unangemessene Zeichen eingibt.
Der Rückgabewert eines Event-Handlers ist nur für über Attribute registrierte Handler von Bedeutung.

2. Aufrufreihenfolge

Dokumentelemente oder andere Objekte können mehrere Ereignishandler für bestimmte Ereignistypen registrieren. Wenn das entsprechende Ereignis auftritt, muss der Browser alle Ereignishandler gemäß den folgenden Regeln aufrufen:

Handler, die durch Festlegen von Objekteigenschaften oder HTML-Attributen registriert werden, haben immer Vorrang.
Mit addEventListener() registrierte Handler werden in der Reihenfolge aufgerufen, in der sie registriert wurden.
Mit attachmentEvent() registrierte Handler können in beliebiger Reihenfolge aufgerufen werden, daher sollte der Code nicht von der Reihenfolge der Aufrufe abhängen

3. Ereignisweitergabe

Nach dem Aufruf des im Zielelement registrierten Ereignishandlers „blubbern“ die meisten Ereignisse an die Wurzel des DOM-Baums. Ruft den Ereignishandler für das übergeordnete Element des Ziels auf und ruft dann den Ereignishandler auf, der für das übergeordnete Element des Ziels registriert ist. Dies geht bis zum Document-Objekt und schließlich bis zum Window-Objekt.

Die meisten Ereignisse, die an Dokumentelementen auftreten, sprudeln, mit bemerkenswerten Ausnahmen sind die Fokus-, Unschärfe- und Scroll-Ereignisse. Das Ladeereignis des Dokumentelements wird sprudeln, aber es hört auf, auf dem Document-Objekt zu sprudeln, und wird nicht an das Window-Objekt weitergegeben. Das Ladeereignis des Window-Objekts wird nur ausgelöst, wenn das gesamte Dokument geladen ist.

4. Brechen Sie das Standardereignisverhalten ab und verhindern Sie die Ereignisweitergabe

In Browsern, die addEventListener() unterstützen, können Sie das Ereignisobjekt The aufrufen Die Methode PreventDefault() bricht die Standardaktion des Ereignisses ab. In IE vor IE9 kann der gleiche Effekt erzielt werden, indem die returnValue-Eigenschaft des Ereignisobjekts auf false gesetzt wird. Der folgende Codeteil kombiniert drei Techniken zum Abbrechen von Ereignissen:

function cancelHandler(event){
 var event=event||window.event;//兼容IE
 //取消事件相关的默认行为
 if(event.preventDefault) //标准技术
 event.preventDefault();
 if(event.returnValue) //兼容IE9之前的IE
 event.returnValue=false;
 return false; //用于处理使用对象属性注册的处理程序
}

Der Standardvorgang im Zusammenhang mit dem Abbrechen eines Ereignisses ist nur eine der Ereignisabbrüche, und wir können auch die Ereignisweitergabe abbrechen. In Browsern, die addEventListener() unterstützen, können Sie die stopPropagation()-Methode des Ereignisobjekts aufrufen, um zu verhindern, dass sich das Ereignis weiter ausbreitet. Wenn andere Handler für dasselbe Objekt definiert sind, werden die verbleibenden Handler weiterhin aufgerufen, aber Ereignishandler für andere Objekte werden nach dem Aufruf von stopPropagation() nicht aufgerufen.

IE vor IE9 unterstützt die stopPropagation()-Methode nicht, setzt aber die cancelBubble-Eigenschaft des Ereignisobjekts auf true, um eine weitere Ausbreitung des Ereignisses zu verhindern.

Okay, das Obige ist der gesamte vom Herausgeber zusammengestellte Inhalt, ich hoffe, er wird für alle hilfreich sein~

Verwandte Empfehlungen:

JavaScript zur Alarmimplementierung Eingabeaufforderungen Ausführliche Erläuterung der Soundeffekte

Ausführliche Erläuterung der Beispiele für JavaScript-Prioritätswarteschlangen und kreisförmige Warteschlangen

Teilen von Beispielen für die JavaScript-Implementierung auf drei Ebenen kaskadierende Spezialeffekte

Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung der JS-Propagierung von Ereignissen, der Aufhebung des Standardverhaltens von Ereignissen und der Verhinderung der Ereignisweitergabe. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!