Heim > Web-Frontend > js-Tutorial > Hauptteil

Ereignismechanismus und Blockierung in jq und js

小云云
Freigeben: 2017-12-08 16:41:50
Original
1739 Leute haben es durchsucht


Ereignisbindung in JQuery ist alles Ereignis-Bubbling. In diesem Artikel werden wir Ihnen den Ereignismechanismus und die Prävention in jq und js vorstellen.


Die verschiedenen Möglichkeiten, Ereignisverarbeitungsfunktionen in JQuery zu binden, erlauben es uns nicht, den Ereignistyp (Ereignisblasen oder Ereigniserfassung) zu übergeben ). Zum Beispiel:

.on(events [, selector ] [, data ], handler)
Nach dem Login kopieren

Parameter
Ereignisse – Geben Sie als Zeichenfolge einen oder mehrere Ereignistypen ein, die durch Leerzeichen und optionale Namensräume getrennt sind, z. B. „Klick“, „Fokus-Klick“ „, „keydown.myPlugin“.
eventsMap – Der Objekttyp ist ein Objektobjekt, jedes seiner Attribute entspricht dem Ereignistyp und dem optionalen Namespace (Parameterereignisse) und der Attributwert entspricht der gebundenen Ereignisverarbeitungsfunktion (Parameterhandler). .
selector – Optional/String-Typ Ein jQuery-Selektor, der verwendet wird, um anzugeben, welche untergeordneten Elemente gebundene Ereignisse auslösen können. Wenn dieser Parameter null ist oder weggelassen wird, bedeutet dies, dass das aktuelle Element selbst an das Ereignis gebunden ist (der eigentliche Auslöser kann auch ein untergeordnetes Element sein, solange der Ereignisstrom das aktuelle Element erreichen kann).
Daten – optional/jede Art von Daten, die über event.data an die Ereignisverarbeitungsfunktion übergeben werden müssen, wenn ein Ereignis ausgelöst wird.
handler – Ereignisbehandlungsfunktion, angegeben durch den Funktionstyp.

Der von nativem Javascript bereitgestellte addEventListener() ermöglicht das Festlegen des Ereignistyps

element.addEventListener(event, function, useCapture)
Nach dem Login kopieren

Parameter
Ereignis – erforderlich. Zeichenfolge, die den Ereignisnamen angibt.

Hinweis: Verwenden Sie nicht das Präfix „on“. Verwenden Sie beispielsweise „click“ anstelle von „onclick“.

Funktion – erforderlich. Geben Sie die Funktion an, die ausgeführt werden soll, wenn das Ereignis ausgelöst wird.

Wenn das Ereignisobjekt als erster Parameter an die Funktion übergeben wird. Der Typ des Ereignisobjekts hängt vom jeweiligen Ereignis ab. Beispielsweise gehört das „click“-Ereignis zum MouseEvent-Objekt.
useCapture – Optional. Ein boolescher Wert, der angibt, ob das Ereignis in der Erfassungs- oder Bubbling-Phase ausgeführt wird.

Mögliche Werte:
true – der Event-Handler wird während der Erfassungsphase ausgeführt
false – false – Standard. Der Event-Handler wird während der Bubbling-Phase ausgeführt

Zwei Möglichkeiten, die Ereignisweitergabe zu verhindern

Methode 1: Verwenden Sie die Funktion stopPropagation() des Ereignisobjekts. Dieser Ansatz ist konsistent mit JavaScript.

$("#outC").click(function(event){  
    event.stopPropagation();  
});
Nach dem Login kopieren
Nach dem Login kopieren

Methode 2: Der Rückgabewert der Ereignisverarbeitungsfunktion ist falsch. Der addEventListener in JavaScript verfügt nicht über diese Funktion.

$("#outC").click(function(event){  
    return false;  
});
Nach dem Login kopieren

                                                                                                                                                                                                                                                       

Bei der Ereignisbindung in JQuery handelt es sich ausschließlich um Ereignissprudeln.

Die verschiedenen Möglichkeiten, Ereignisverarbeitungsfunktionen in JQuery zu binden, erlauben es uns nicht, den Ereignistyp (Ereignisblasen oder Ereigniserfassung) zu übergeben. Zum Beispiel:

Parameter

.on(events [, selector ] [, data ], handler)
Nach dem Login kopieren
Ereignisse

– Geben Sie als Zeichenfolge einen oder mehrere Ereignistypen ein, die durch Leerzeichen und optionale Namensräume getrennt sind, z. B. „Klick“, „Fokus-Klick“ „, „keydown.myPlugin“.
eventsMap – Der Objekttyp ist ein Objektobjekt, jedes seiner Attribute entspricht dem Ereignistyp und dem optionalen Namespace (Parameterereignisse) und der Attributwert entspricht der gebundenen Ereignisverarbeitungsfunktion (Parameterhandler). .
selector – Optional/String-Typ Ein jQuery-Selektor, der verwendet wird, um anzugeben, welche untergeordneten Elemente gebundene Ereignisse auslösen können. Wenn dieser Parameter null ist oder weggelassen wird, bedeutet dies, dass das aktuelle Element selbst an das Ereignis gebunden ist (der eigentliche Auslöser kann auch ein untergeordnetes Element sein, solange der Ereignisstrom das aktuelle Element erreichen kann).
Daten – optional/jede Art von Daten, die über event.data an die Ereignisverarbeitungsfunktion übergeben werden müssen, wenn ein Ereignis ausgelöst wird.
handler – Ereignisbehandlungsfunktion, angegeben durch den Funktionstyp.
Der von nativem Javascript bereitgestellte addEventListener() ermöglicht das Festlegen des Ereignistyps

Parameter

element.addEventListener(event, function, useCapture)
Nach dem Login kopieren
Ereignis

– erforderlich. Zeichenfolge, die den Ereignisnamen angibt.
Hinweis: Verwenden Sie nicht das Präfix „on“. Verwenden Sie beispielsweise „click“ anstelle von „onclick“.

Funktion

– erforderlich. Geben Sie die Funktion an, die ausgeführt werden soll, wenn das Ereignis ausgelöst wird.

Wenn das Ereignisobjekt als erster Parameter an die Funktion übergeben wird. Der Typ des Ereignisobjekts hängt vom jeweiligen Ereignis ab. Beispielsweise gehört das „click“-Ereignis zum MouseEvent-Objekt.

useCapture

– Optional. Ein boolescher Wert, der angibt, ob das Ereignis in der Erfassungs- oder Bubbling-Phase ausgeführt wird.
Mögliche Werte: true – der Event-Handler wird während der Erfassungsphase ausgeführt

false – false – Standard. Der Event-Handler wird während der Bubbling-Phase ausgeführt


Zwei Möglichkeiten, die Ereignisweitergabe zu verhindern

Methode 1: Verwenden Sie die Funktion stopPropagation() des Ereignisobjekts. Dieser Ansatz ist konsistent mit JavaScript.

Methode 2: Der Rückgabewert der Ereignisverarbeitungsfunktion ist falsch. Der addEventListener in JavaScript verfügt nicht über diese Funktion.

$("#outC").click(function(event){  
    event.stopPropagation();  
});
Nach dem Login kopieren
Nach dem Login kopieren

Verwandte Empfehlungen:

$("#outC").click(function(event){  
    return false;  
});
Nach dem Login kopieren


JavaScript-Ereignismechanismus

Ein erster Blick auf den Ereignismechanismus von JQuery (2) (1)_jquery

Eine kurze Analyse des Ereignismechanismus in JavaScript_Grundkenntnisse

Das obige ist der detaillierte Inhalt vonEreignismechanismus und Blockierung in jq und js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage