Eine kurze Analyse des Ereignismechanismus in JavaScript

Eine kurze Analyse des Ereignismechanismus in JavaScript_Grundkenntnisse

WBOY

Freigeben： 2016-05-16 15:56:44

Original

1419 Leute haben es durchsucht

Was ist die Veranstaltung?

JavaScript interagiert mit HTML über Ereignisse, die auf der Seite auftreten, wenn der Benutzer oder Browser sie manipuliert.

Wenn die Seite geladen wird, handelt es sich um ein Ereignis. Wenn der Benutzer auf eine Schaltfläche klickt, handelt es sich um ein Ereignis. Ein weiteres Beispiel für Ereignisse ist das Drücken einer beliebigen Taste, das Schließen eines Fensters, das Ändern der Fenstergröße usw.

Entwickler können diese Ereignisse verwenden, um JavaScript-codierte Antworten auszuführen, die dazu führen, dass Schaltflächen das Fenster schließen, dem Benutzer Nachrichten angezeigt werden, Daten validiert werden und praktisch jede andere Art von Antwort, die auftreten kann.

Ereignisse sind Level 3 des Document Object Model (DOM). Jedes HTML-Element verfügt über eine Reihe von Ereignissen, die JavaScript-Code auslösen können.

Beispiel:

<html>
<head>
<script type="text/javascript">
<!--
function sayHello() {
  alert("Hello World")
}
//-->
</script>
</head>
<body>
<input type="button" onclick="sayHello()" value="Say Hello" />
</body>
</html>

Nach dem Login kopieren

Dies führt zu folgendem Ergebnis: Wenn Sie auf die Schaltfläche „Hallo“ klicken, löst das Ereignis onclick die Funktion sayHello() aus.

onsubmit-Ereignistyp:

Ein weiterer wichtiger Ereignistyp ist onsubmit. Dieses Ereignis wird ausgelöst, wenn versucht wird, das Formular abzusenden. Daher können Sie die Formularvalidierung auf diesen Ereignistyp ausrichten.

Das Folgende ist ein einfaches Beispiel, um seine Verwendung zu veranschaulichen. Hier rufen wir eine Funktion „validate()“ auf, bevor wir die Formulardaten an den Webserver senden. Die Funktion „validate()“ gibt „true“ zurück, wenn das Formular übermittelt wird, andernfalls werden die Daten nicht übermittelt.
Beispiel:

<html>
<head>
<script type="text/javascript">
<!--
function validation() {
  all validation goes here
  .........
  return either true or false
}
//-->
</script>
</head>
<body>
<form method="POST" action="t.cgi" onsubmit="return validate()">
.......
<input type="submit" value="Submit" />
</form>
</body>
</html>

Nach dem Login kopieren

onmouseover und onmouseout:

Diese beiden Ereignistypen helfen dabei, schöne Effekte mit Bildern oder sogar Text zu erzeugen. Wenn die Maus auf einem Element platziert wird, tritt das Ereignis „onmouseout“ auf, wenn die Maus aus dem Element herausbewegt wird, und das Ereignis „onmouseover“, wenn die Maus darüber bewegt wird.
Beispiel:

Das folgende Beispiel zeigt, dass die Gruppenantwort wie folgt lautet:

<html>
<head>
<script type="text/javascript">
<!--
function over() {
  alert("Mouse Over");
}
function out() {
  alert("Mouse Out");
}
//-->
</script>
</head>
<body>
<div onmouseover="over()" onmouseout="out()">
<h2> This is inside the division </h2>
</div>
</body>
</html>

Nach dem Login kopieren

Sie können diese beiden Ereignistypen verwenden, um verschiedene Bilder zu ändern und auch Benutzer zu erstellen, die Ihnen helfen.
HTML 4-Standardereignisse

Standard-HTML4-Ereignisse werden hier als Referenz aufgeführt. Das folgende Skript zeigt eine Javascript-Funktion an, die bei diesem Ereignis ausgeführt werden soll.

201564104949263.jpg (616×728)