Javascript-Grundlagen (2) Events_Grundkenntnisse

Ereignisobjekt: (Das Ereignisobjekt ist eine Eigenschaft des Fensterobjekts. Wenn ein Ereignis auftritt, wird gleichzeitig ein Ereignisobjekt generiert. Wenn das Ereignis endet, verschwindet das Ereignisobjekt)

Im IE: window.event;//Get the object

In DOM: argument[0];//Get the object

Häufig verwendete Attributmethoden von Ereignisobjekten im IE:

1.clientX: Wenn das Ereignis auftritt, die X-Koordinate des Mauszeigers im Clientbereich (ausgenommen Symbolleisten, Bildlaufleisten usw.);

2.clientY: Wenn das Ereignis auftritt, die Y-Koordinate des Mauszeigers im Clientbereich (ausgenommen Symbolleisten, Bildlaufleisten usw.);

3.keyCode: Geben Sie bei keyCode-Ereignissen das Unicode-Zeichen der gedrückten Taste an. Bei Keydown-/Keyup-Ereignissen geben Sie an, dass es sich bei der gedrückten Tastatur um einen numerischen Indikator handelt (rufen Sie den Wert der Taste ab).

4.offsetX: X-Koordinate des Mauszeigers relativ zum Objekt, das das Ereignis ausgelöst hat;

5.offsetY: Y-Koordinate des Mauszeigers relativ zum Objekt, das das Ereignis ausgelöst hat;

6.srcElement: Das Element, das das Ereignis verursacht hat;

Häufig verwendete Attributmethoden von Ereignisobjekten im DOM:

1.clientX;

2.clientY;

3.pageX; X-Koordinate des Mauszeigers relativ zur Seite;

4.pageY; Y-Koordinate des Mauszeigers relativ zur Seite;

5.StopPropagation: Der Aufruf dieser Methode kann die weitere Ausbreitung (Blase) des Ereignisses verhindern;

6.target: ausgelöstes Ereigniselement/Objekt;

7.Typ: Name des Ereignisses;

Die Ähnlichkeiten und Unterschiede zwischen den beiden Ereignisobjekten

:

Gleiche Punkte:

1. Holen Sie sich den Ereignistyp 2. Holen Sie sich den Tastaturcode (Keydown/Keyup-Ereignis);

3. Umschalt, Alt, Strg erkennen;

4. Holen Sie sich die Koordinaten des Kundenbereichs

5. Bildschirmkoordinaten abrufen;

Unterschiede:

1. Holen Sie sich das Ziel

//IE: var oTarget=oEvent.srcElement;

//DOM: var oTarget=oEvent.target;

2. Zeichencode abrufen

//IE: var iCharCode=oEvent.keyCode;

//DOM: var iCharCode=oEvent.charCode;

3. Blockieren Sie das Standardverhalten von Ereignissen

//IE: oEvent.returnValue=false;

//DOM: oEvent.preventDefault;

4. Sprudeln beenden:

//IE:oEvent.cancelBubble=true;

//DOM:oEvent.stopPropagation

Ereignistyp:

1. Mausereignisse:

onmouseover: wenn die Maus hinein bewegt wird;

onmouseout: wenn die Maus herausbewegt wird;

onmousedown: wenn die Maus gedrückt wird;

onmouseup: wenn die Maus angehoben wird; onclick: beim Klicken mit der linken Maustaste;

ondblclick: beim Doppelklicken mit der linken Maustaste;

2. Tastaturereignisse:

onkeydown: Tritt auf, wenn der Benutzer eine Taste auf der Tastatur drückt;

onkeyup: Tritt auf, wenn der Benutzer eine gedrückte Taste loslässt;

Tastendruck: Wenn der Benutzer die Taste

weiterhin drückt

3. HTML-Ereignisse:

onload: beim Laden der Seite; onunload: beim Entladen der Seite;

Abbruch: Wenn der Benutzer den Ladevorgang abbricht und dieser nicht vollständig geladen wurde, tritt ein Abbruchereignis auf

Fehler: Ereignis wird generiert, wenn ein JavaScript-Fehler auftritt;

Auswählen: Wenn der Benutzer in einem Eingabe- oder Textbereich ein Zeichen auswählt, wird das Auswahlereignis ausgelöst

Änderung: Wenn in einem Eingabe- oder Textbereich der Fokus verloren geht, wird das Änderungsereignis in der Auswahl

ausgelöst Senden: Wenn das Formular gesendet wird, wird das Übermittlungsereignis ausgelöst Zurücksetzen:Zurücksetzen

Größe ändern: Ereignis wird ausgelöst, wenn die Größe des Fensters oder Rahmens geändert wird;

scrollen: Ereignis wird ausgelöst, wenn der Benutzer scrollt oder eine Bildlaufleiste hat;

Fokus: wenn der Fokus verloren geht;

Unschärfe: beim Fokussieren;

Javascript-Ereignismodell

1.Javascript-Ereignismodell: 1. Bubbling-Typ: Wenn der Benutzer auf die Schaltfläche klickt: input-body-html-document-window (Blasen von unten nach oben) IE-Browsing Gerät verwendet nur Sprudeln

2. Erfassungstyp: Wenn der Benutzer auf die Schaltfläche klickt: window-document-html-body-input (von oben nach unten)

Nach der ECMA-Standardisierung unterstützen andere Browser beide Typen, die Erfassung erfolgt zuerst.

2. Drei Arten, traditionelle Ereignisse zu schreiben:

1.

2.======<script>function name1(){alert('helloword!');}</script> /Berühmte Funktion

3. //Anonyme Funktion

Code kopieren

Der Code lautet wie folgt:

<script><p> Var button1=document.getElementById("input1");</p> button1.onclick=funtion(){<p> alarm('helloword!')</p> }<p> </script>

3. So schreiben Sie moderne Ereignisse:

Code kopieren Der Code lautet wie folgt:

//Ajouter un événement dans IE

<script><br> var fnclick(){<br> alert("J'ai été cliqué")<br> ><br> var Oinput=document.getElementById("input1");<br> Oinput.attachEvent("onclick",fnclick);<br> -----------------------------------------------<br> Oinput.detachEvent("onclick",fnclick);//Supprimer les événements dans IE<br> </script>

Copier le code Le code est le suivant :

//Ajouter un événement dans le DOM

<script><br> var fnclick(){<br> alert("J'ai été cliqué")<br> ><br> var Oinput=document.getElementById("input1");<br> Oinput.addEventListener("onclick",fnclick,true);<br> -----------------------------------------------<br> Oinput.removeEventListener("onclick",fnclick);//Supprimer les événements dans DOM<br> </script>

Copier le code Le code est le suivant :

//Compatible avec IE et DOM ajoutant des événements

<script><br> var fnclick1=function(){alert("J'ai été cliqué")}<br> var fnclick2=function(){alert("J'ai été cliqué")}<br> var Oinput=document.getElementById("input1");<br> si(document.attachEvent){<br> Oinput.attachEvent("onclick",fnclick1)<br> Oinput.attachEvent("onclick",fnclick2)<br> ><br> autre(document.addEventListener){<br> Oinput.addEventListener("click",fnclick1,true)<br> Oinput.addEventListener("click",fnclick2,true)<br> ><br> </script>