Heim > Web-Frontend > js-Tutorial > Javascript-Grundlagen (2) Events_Grundkenntnisse

Javascript-Grundlagen (2) Events_Grundkenntnisse

WBOY
Freigeben: 2016-05-16 16:34:56
Original
1125 Leute haben es durchsucht

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>

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