Maison > interface Web > js tutoriel > le corps du texte

Comment configurer l'écoute d'événements en javascript

青灯夜游
Libérer: 2021-10-25 14:28:38
original
5286 Les gens l'ont consulté

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.

Comment configurer l'écoute d'événements en javascript

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(&#39;123&#39;);">点击</button>
Copier après la connexion

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(&#39;btn&#39;);
				btn.onclick = function(){
					alert("hello world");
				}
			}
		</script>
	</head>
	<body>
		<button id="btn">点击</button>
	</body>
</html>
Copier après la connexion

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(&#39;btn&#39;);
				btn.addEventListener(&#39;click&#39;,function(){
					alert("123");
				},false);
			}
		</script>
	</head>
	<body>
		<button id="btn">点击</button>
	</body>
</html>
Copier après la connexion

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal