Lassen Sie mich Ihnen Ereignisobjekte vorstellen. Was sind die js-Ereignisobjekte?-js-Tutorial-php.cn

Lassen Sie mich Ihnen Ereignisobjekte vorstellen. Was sind die js-Ereignisobjekte?

php是最好的语言

Freigeben： 2018-07-26 12:53:37

Original

1662 Leute haben es durchsucht

Lassen Sie uns zunächst das Ereignisobjekt vorstellen. Ereignisse existieren in Form von Objekten in Browsern, also Ereignissen. Wenn ein Ereignis ausgelöst wird, wird ein Ereignisobjekt-Ereignis generiert, das alle mit dem Ereignis verbundenen Informationen enthält. Enthält die Elemente, die das Ereignis verursacht haben, die Art des Ereignisses und andere Informationen im Zusammenhang mit dem spezifischen Ereignis. Dieser Artikel stellt hauptsächlich die relevanten Informationen zu js-Ereignisobjekten in JavaScript-Ereignissen vor. Er ist sehr gut und hat Referenzwert.

1. Ereignisobjekt

1. Das Ereignisobjekt verstehen

Ereignisse existieren in Form von Objekten in Browsern, also Ereignissen . Wenn ein Ereignis ausgelöst wird, wird ein Ereignisobjekt-Ereignis generiert, das alle mit dem Ereignis verbundenen Informationen enthält. Enthält die Elemente, die das Ereignis verursacht haben, die Art des Ereignisses und andere Informationen im Zusammenhang mit dem spezifischen Ereignis.

Zum Beispiel: Durch Mausoperationen generierte Ereignisse enthalten Informationen über die Mausposition; durch Tastaturoperationen generierte Ereignisse enthalten Informationen über die gedrückten Tasten.

Alle Browser unterstützen Ereignisobjekte, aber die Unterstützungsmethoden sind unterschiedlich. Im DOM muss das Ereignisobjekt als einziger Parameter an die Ereignisverarbeitungsfunktion übergeben werden.

2. event

<input id="btn" type="button" value="click" onclick=" console.log(&#39;html事件处理程序&#39;+event.type)"/>

Nach dem Login kopieren

im HTML-Ereignishandler erstellt eine Funktion, die die lokale Variable event enthält. Auf Ereignisobjekte kann direkt über das Ereignis zugegriffen werden.

3. Ereignisobjekte im DOM

Sowohl DOM-Level-0- als auch DOM-Level-2-Ereignishandler übergeben Ereignisse als Parameter.

<body>
<input id="btn" type="button" value="click"/>
<script>
var btn=document.getElementById("btn");
btn.onclick=function(event){
console.log("DOM0 & click");
console.log(event.type); //click
}
btn.addEventListener("click", function (event) {
console.log("DOM2 & click");
console.log(event.type); //click
},false);
</script>
</body>

Nach dem Login kopieren

4. Ereignisobjekt im IE

Der erste Fall: Beim Hinzufügen eines Ereignishandlers über die DOM0-Ebenenmethode wird das Ereignisobjekt als verwendet Fensterobjekt Eine Eigenschaft ist vorhanden.

<body>
<input id="btn" type="button" value="click"/>
<script>
var btn=document.getElementById("btn");
btn.onclick= function () {
var event=window.event;
console.log(event.type); //click
}
</script>
</body>

Nach dem Login kopieren

Der zweite Fall: Der über attachmentEvent() hinzugefügte Ereignishandler, das Ereignisobjekt wird als Parameter übergeben.

<body>
<input id="btn" type="button" value="click"/>
<script>
var btn=document.getElementById("btn");
btn.attachEvent("onclick", function (type) {
console.log(event.type); //click
})
</script>
</body>

Nach dem Login kopieren

Aber es gibt zwei Dinge, die ich nicht verstehe.

1. Ein Ereignisparameter kann auch an den über die DOM-Level-0-Methode hinzugefügten Ereignishandler übergeben werden. Sein Typ ist derselbe wie window.event.type, aber der Ereignisparameter übergeben ist anders als window.event, warum?

btn.onclick= function (event) {
var event1=window.event;
console.log(&#39;event1.type=&#39;+event1.type); //event1.type=click
console.log(&#39;event.type=&#39;+event.type); //event.type=click
console.log(&#39;event1==event?&#39;+(event==event1)); //event1==event?false
}

Nach dem Login kopieren

2. Das im durch attachmentEvent hinzugefügte Ereignis übergebene Ereignis unterscheidet sich von window.event.

<body>
<input id="btn" type="button" value="click"/>
<script>
var btn=document.getElementById("btn");
btn.attachEvent("onclick", function (type) {
console.log(event.type); //click
console.log("event==window.event?"+(event==window.event)); //event==window.event?false
})
</script>
</body>

Nach dem Login kopieren

Das Obige ist die vom Herausgeber vorgestellte Zusammenfassung des JavaScript-Event-Lernens (3). Ich hoffe, dass es für alle hilfreich ist Bitte achten Sie auf den Inhalt der Website von Script House!

Verwandte Empfehlungen:

Das obige ist der detaillierte Inhalt vonLassen Sie mich Ihnen Ereignisobjekte vorstellen. Was sind die js-Ereignisobjekte?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!