Maison > Article > interface Web > Comment configurer l'écoute d'événements en javascript
Comment configurer l'écoute d'événements en javascript
- 青灯夜游original
- 2021-10-20 17:27:315269parcourir
Méthode de configuration : 1. Définie via l'attribut d'événement dans la balise HTML, la syntaxe est "on+event name="processing function"" ; 2. Utilisez "element.onclick" pour définir ; méthode à définir.
L'environnement d'exploitation de ce tutoriel : système Windows 7, JavaScript version 1.8.5, ordinateur Dell G3.
Plusieurs façons d'implémenter la surveillance des événements dans JS
1. Liaison en ligne
Liaison en ligne : liaison via les attributs d'événement dans les balises HTML Méthode de liaison : on+nom de l'événement, dans l'événement déclenché. attribut, comme suit :
<button onclick="alert('123');">点击</button>
2. Utilisez element.onclick pour la liaison d'événement
Utilisez element.onclick pour la liaison d'événement : en exploitant les éléments du DOM, liez les événements au DOM (utilisez la liaison intra-pair du formulaire).
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script>
window.onload = function(){
var btn = document.getElementById('btn');
btn.onclick = function(){
alert("hello world");
}
}
</script>
</head>
<body>
<button id="btn">点击</button>
</body>
</html>3. Utilisez la méthode addEventListener()
Utilisez la méthode addEventListener(), qui accepte 3 paramètres (le nom de l'événement à traiter, la fonction en tant que gestionnaire d'événement et une valeur booléenne. Cette valeur booléenne signifie vrai (le gestionnaire d'événements est appelé pendant la phase de capture d'événements, si faux, il est appelé pendant la phase de bouillonnement d'événements). Certains navigateurs ne prennent pas en charge la capture d'événements (comme IE8 et versions antérieures), soyez donc prudent lors de la liaison des écouteurs d'événements pendant la phase de capture.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script>
window.onload = function(){
var btn = document.getElementById('btn');
btn.addEventListener('click',function(){
alert("123");
},false);
}
</script>
</head>
<body>
<button id="btn">点击</button>
</body>
</html>Méthode pour dissocier un événement : appelez RemoveEventListener() via l'élément pour le supprimer. Les paramètres transmis sont les mêmes que lors de l'ajout du gestionnaire d'événements. Le deuxième paramètre (fonction du gestionnaire d'événements) doit être le même (l'adresse de pointage. est le même), donc la fonction de gestionnaire d'événements doit être enregistrée dans une variable. Si la fonction anonyme est transmise, l'écouteur d'événements ne peut pas être supprimé.
Remarque : dans IE8 et versions antérieures, utilisez attachEvent() pour la liaison d'événement, qui accepte 2 paramètres (nom du gestionnaire d'événement, fonction du gestionnaire d'événement). Le gestionnaire d'événements lié par cette méthode sera en phase de bouillonnement. Cette méthode peut lier plusieurs gestionnaires d'événements, mais l'ordre d'exécution est inversé par rapport à l'ordre de liaison.
【Apprentissage recommandé : Tutoriel avancé javascript】
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!