Zusammenfassung der Anwendungsbeispiele einiger gängiger Ereignisfunktionen in jQuery

1.$(document).ready()

$(document).ready() ist die Antwort in jQuery JavaScriptEine typische Art, das integrierte Onload-Ereignis zu verwenden und Aufgaben auszuführen. Es hat einen ähnlichen Effekt wie Onload. Es gibt jedoch einige Unterschiede:
Wenn ein Dokument vollständig in den Browser heruntergeladen wird, wird das window.onload-Ereignis ausgelöst. Das mit $(document).ready() registrierte Ereignishandler-Programm kann ausgeführt werden, nachdem der HTML-Download abgeschlossen und in einen Dom-Baum geparst wurde. Dies bedeutet jedoch nicht, dass alle zugehörigen Dateien heruntergeladen wurden . .
Es gibt im Allgemeinen nur einen Onload-Ereignishandler auf einer Seite und es kann immer nur eine Referenz auf eine Funktion gleichzeitig gespeichert werden, während $(document).ready() mehrere haben kann.
Im Allgemeinen ist $(document).ready() besser als die Verwendung des Onload-Ereignishandlers. Wenn die zugehörige Datei jedoch nicht geladen wurde, kommt es zu Problemen beim Aufruf der -Attribute wie Bildhöhe und -breite, sodass Sie die entsprechende Methode zu unterschiedlichen Zeitpunkten auswählen müssen.

$(document).ready()有三种写法，分别是： 
> $(document).ready(function() { 
//this is the coding... 
}); 
>$().ready(function() { 
//this is the coding... 
}); 
>$(function() { 
//this is the coding... 
});

2. Ereigniserfassung und Ereignissprudeln
Ereigniserfassung: Eine Strategie, die es mehreren Elementen ermöglicht, auf Ereignisse zu reagieren. Während des Ereigniserfassungsprozesses wird das Ereignis zunächst an das äußerste Element und dann an spezifischere Elemente übergeben.
Ereignis-Bubbling: Eine andere entgegengesetzte Strategie wird als Zeit-Bubbling bezeichnet. Wenn ein Ereignis auftritt, wird es zuerst an das spezifischste Element gesendet. Nachdem dieses Element die Möglichkeit hat, zu reagieren, wird das Ereignis an allgemeinere Elemente weitergeleitet. Das Bubbling von Ereignissen kann manchmal Nebenwirkungen haben und zu unerwartetem Verhalten führen.
3. Drei Möglichkeiten, um das Sprudeln von Ereignissen zu verhindern
Angeben der Standardaktion
Durch Aufrufen der Methode .preventDefault() kann das Ereignis beendet werden, bevor die Standardaktion initiiert wird.
Rufen Sie event.stopPropagation() auf, um die Ereignisweitergabe zu stoppen.
jQuery bietet eine .stopPropagation()-Methode, die das Sprudeln von Ereignissen vollständig verhindern kann. Der Beispielcode lautet wie folgt:
Verwenden Sie die Methode stopPropagation(), um das Sprudeln von Ereignissen zu verhindern

$(document).ready(function() { 
$('switcher').click(function(event){ 
if(this.id == 'switcher-narrow'){ 
$('body').addClass('narrow'); 
} 
else if(this.id == 'switcher-large'){ 
$('body').addClass('large'); 
} 
$('switcher .button').romoveClass('selected'); 
$(this).addClass('selected'); 
event.stopPropagation(); 
};) 
});

Verwenden Sie das Attribut event.tatget, um das Ereignis zu klären Objekt
Ereignisverarbeitung Die Variable Ereignis im Programm speichert das Ereignisobjekt. 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 klären und zu verhindern, dass das Ereignis sprudelt. Der Code lautet wie folgt:

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

4. Häufig verwendete Ereignisbindungen
jQuery verwendet die Methode .bind(), um Ereignisse an Elemente zu binden und die Bindung von Elementen mithilfe der Methode .unbind() aufzuheben. Darüber hinaus kann die Methode .bind() mehrere Bindungen durchführen. Wenn keine Bindung vorhanden ist, ist das Aufheben der Bindung sicher.
Oft muss ein Ereignis nur einmal ausgelöst werden und muss dann sofort aufgehoben werden. Gemäß dem traditionellen Ansatz binden wir das Ereignis möglicherweise zuerst und lösen es dann, nachdem das Ereignis ausgeführt wurde. jQuery stellt uns eine Kurzschriftmethode zur Verfügung, um das mühsame Schreiben von Code im obigen Szenario wie folgt zu lösen:

$(document).ready(function(){ 
$('#swotcjer').one('click',toggleStyleSwitcher); 
});

5 Bei der Erfassung von Ereignissen ist es häufig erforderlich, kombinierte Benutzervorgänge zu erfassen und mit mehreren Funktionen zu reagieren. Diese Ereignisse werden als zusammengesetzte Ereignisse bezeichnet.
Die von jQuery bereitgestellte Methode .read() ist eine der am häufigsten verwendeten ereigniskompatiblen Methoden. Darüber hinaus werden zwei Funktionen für die interaktive Verarbeitung verwendet: .hover(over,out) Eine Methode, die simuliert Hover-Ereignisse (die Maus bewegt sich über ein Objekt und aus diesem heraus). Dies ist eine benutzerdefinierte Methode, die für häufig verwendete Aufgaben einen „Keep-in-it“-Status bereitstellt.
.toggle(fn,fn) Schaltet die Funktion um, die jedes Mal aufgerufen werden soll, wenn darauf geklickt wird.

Das obige ist der detaillierte Inhalt vonZusammenfassung der Anwendungsbeispiele einiger gängiger Ereignisfunktionen in jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!