Pour les types d'événements utilisateur, les plus couramment utilisés sont la souris, le clavier et le navigateur.
1. Événement de souris:
Tous les événements de la souris sont fréquemment utilisés. Les exemples suivants sont utilisés pour tester divers événements de souris.
La copie de code est la suivante:
<script linguisse = "javascript">
Poignée de fonction (Oevent) {
var disp = document.getElementById ("affichage");
if (window.event) oevent = window.event; // gérer la compatibilité et obtenir l'objet
disp.innerhtml + = "Nom de l'événement de la souris:" + oevent.type + "<br>";
}
window.onload = function () {
var op = document.getElementById ("box");
OP.Onmousedown = Handle;
op.onMouseOver = manche;
op.onMouseUp = manche;
op.onMouseout = manche;
op.OnClick = manche;
op.ondblclick = manche;
}
</cript>
<div>
<div id = "box">
Contenu de la boîte
</div>
<p id = "affiche"> </p>
</div>
Test de bouton de valeur de clé de souris (avec table de référence)
La copie de code est la suivante:
<script linguisse = "javascript">
fonction TestClick (oevent) {
var odiv = document.getElementById ("affichage");
if (window.event)
oevent = window.event;
odiv.innerhtml + = oevent.button; // Sortie de la valeur du bouton
}
document.onmousedown = testclick;
window.onload = testclick; // Le test n'a appuyé sur aucune clé
</cript>
<div>
<p id = "affiche"> </p>
</div>
2. Événements de clavier
Il n'y a pas beaucoup de types d'événements de clavier, seulement trois types d'événements.
Keydown (appuyez sur une touche, appuyez sur et maintenez-le, continuera de déclencher)
DES VRÉSE (déclenché lorsqu'une touche est enfoncée et qu'un caractère est généré, c'est-à-dire qu'il ignore les touches de fonction telles que Shift, Alt, Ctrl)
KeyUp (déclenché lorsqu'une clé est libérée)
Exemple d'écoute du clavier:
La copie de code est la suivante:
<script linguisse = "javascript">
Poignée de fonction (Oevent) {
if (window.event) oevent = window.event; // gérer la compatibilité et obtenir un objet d'événement
var odiv = document.getElementById ("affichage");
odiv.innerhtml + = oevent.type + ""; // Nom de l'événement de sortie
}
window.onload = function () {
var otextarea = document.getElementById ("textIn");
otextarea.onkeydown = manche; // écoute tous les événements du clavier
otextarea.onkeyup = manche;
otextarea.onKeyPress = manche;
}
</cript>
<div>
<textarea rows = "4" cols = "50" id = "textin">
</ textarea>
<p id = "affiche"> </p>
</div>
Pour le clavier, la chose la plus importante n'est pas le nom de l'événement, mais quelle touche est appuyée. Étant donné que IE n'a pas de propriété Charcode, Keycode est le même que le DOM Keycode standard uniquement lorsque les événements de clés et de keyup se produisent.
Dans les événements de la pression de kippe, la méthode suivante est utilisée.
La copie de code est la suivante: OEVENT.CHARCODE = (OEVENT.TYPE == "Keypress")? Oevent.Keycode :();
La raison pour laquelle Keycode n'est pas adopté est car il représente les touches du clavier, pas les caractères de sortie. Par conséquent, la sortie "A" et "A", Keycode est équivalent, et Charcode se distingue par les caractères.
De plus, dans Keypress, la valeur Keycode du DOM standard est toujours 0;
Exemple: propriétés connexes des événements du clavier:
La copie de code est la suivante:
<script linguisse = "javascript">
Poignée de fonction (Oevent) {
var odiv = document.getElementById ("affichage");
if (window.event) oevent = window.event; // gérer la compatibilité et obtenir un objet d'événement
// Définit la valeur de IE Charcode
oevent.charcode = (oevent.type == "keypress")? Oevent.KeyCode: 0;
odiv.innerhtml + = oevent.type + ": charcode" + oevent.charcode + "keycode" + oevent.keycode + "<br>"; // Test de sortie
}
window.onload = function () {
var otextarea = document.getElementById ("textIn");
otextarea.onkeydown = manche; // écoute tous les événements du clavier
otextarea.onKeyPress = manche;
}
</cript>
<div>
<textarea rows = "4" cols = "50" id = "textin">
</ textarea>
<p id = "affiche"> </p>
</div>
3.htm événement
Pour les navigateurs, divers événements HTML ont leurs propres événements, et certains d'entre eux sont souvent exposés par les utilisateurs, tels que la charge, l'erreur, la sélection, etc. Les événements HTML couramment utilisés sont les suivants:
L'événement de charge est l'un des événements couramment utilisés, car le cadre DOM n'a pas été construit avant la fin du chargement de la page, donc aucune opération connexe ne peut se produire.
Attribuez un chargement aux objets de fenêtre, l'événement de décharge est équivalent aux méthodes onload et onunload marquées par le <body>.