addEventListener pour deux événements

**Careixo** · 09/01/2010, 16h09

Pour mieux comprendre les événements javascript, j'ai fait ce petit bout de code:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
<html>
<body>
<button id='b1'>Bouton 1</button>
<button id='b2'>Bouton 2</button>
 
<script type='text/javascript'>
 
var obj = {
	met: function(el) {
		alert(el);
	}
};
 
document.getElementById('b1').addEventListener("click", obj.met('b1'), false);
document.getElementById('b2').addEventListener("click", obj.met('b2'), false);
 
</script>
</body>
</html>

Normalement, ce code crée deux boutons, et lorsqu'ils sont cliqués, ils envoient un alert.
Par contre, seulement le premier événement est pris en compte, et en plus, dès le chargement de la page, et non lors du click.

Il y a déjà quelques jours que je tourne autour de ça, mais je n'arrive à mettre la main sur ce qui semble être un problème de base.

Je vous remercie d'avance pour vos lumières.

**Bovino** · 09/01/2010, 16h19

Salut et bienvenue sur developpez.com

Il s'agit d'un grand classique

L'utilisation correcte de addEventListener est :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById('b1').addEventListener("click", obj.met, false);

Ainsi, tu passes à ton événement une référence à la fonction, quand tu fais :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById('b1').addEventListener("click", obj.met('b1'), false);

Tu passes comme callback le résultat de l'exécution de la fonction.
Si tu veux passer des paramètres, tu peux utiliser une fonction anonyme :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById('b1').addEventListener("click", function(){obj.met('b1')}, false);

**Careixo** · 09/01/2010, 16h46

Merci pour la bienvenue, et aussi pour la réponse.
Je retiens donc, qu'il suffit de ne pas invoquer la fonction. Et si besoin utiliser le tuyau de la fonction anonyme. Impeccable !!
Un grand merci Bovino !

addEventListener pour deux événements

JavaScript

Discussions similaires

Partager

Partager