[QR] Lorsqu'un �v�nement est allou� dynamiquement � un objet HTML, comment transmettre � la fonction appel�e lors de l'�v�nement les objets this et event ?

[Section] Utilisation du DOM

[Auteur] FremyCompany

[Commentaires] Lorsque l'on alloue dynamiquement un �v�nement � un objet, il peut �tre parfois utile de transmettre � la fonction l'objet event ainsi que l'objet (this) qui a d�clench� cet �v�nement.

Voici comment proc�der :
Code xhtml : 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
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
 
<head>
 
<title></title>
 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="fr" />
 
<script type="text/javascript">
<!-- 
function initObjet()
{
  document.getElementById("monElement").onclick = function(event)
                                                  { 
                                                    var ev;
                                                    ev = (event?event:window.event); // POUR IE
 
                                                    //id de l'objet et type d'événement
                                                    alert(this.id+" "+ev.type);
                                                  }
}
 
 
 
//-->
</script>
 
</head>
 
<body onload="initObjet()">
 
 
<div id="monElement">bla bla bla bla bla</div>
 
</body>
</html>

[Remarques] Compatible IE7, FF3. Pas test� sous IE6, Op�ra, Konqueror.

Le bout de code ci-dessus a �t� extrait de cette discussion (messages 8 � 12).
J'ai donc r�alis� un exemple en reprenant ce qu'� �crit FremyCompany :
Citation Envoy� par FremyCompany
Il faut passer par une fonction "relais" qui compl�te les events

Voici le code sous-entendu par FireFox :

Code : S�lectionner tout - Visualiser dans une fen�tre � part
function (event) { move(event, this, "coucou"); }
Et celui par IE :

Code : S�lectionner tout - Visualiser dans une fen�tre � part
function () { move(event, this, "coucou"); }
Pour un code compatible on pr�f�rera en g�n�ral :

Code : S�lectionner tout - Visualiser dans une fen�tre � part
1
2
3
4
function (event) {
  event = (event?event:window.event); // POUR IE
  move(event, this, "coucou"); 
}