[POO] Perte de la référence sur mon objet (this) lors d'un évènement

Version imprimable

19/12/2008, 14h58
muad'dib

[POO] Perte de la référence sur mon objet (this) lors d'un évènement
Bonjour à tous,

Désolé pour ce titre probablement très peu clair mais c'est que la situation m'est inconnue et je ne suis pas en mesure de l'expliquer correctement.
Ce que je vais donc faire sera d'expliquer concrètement ce qui se passe.

J'ai d'une part une classe en javascript, appelons la A, définie comme suit:
Code:

1 2 3 A=function() { this.arg = 5; }
J'ai d'autre part une fonction permettant de traiter certaines données de mon objet qui est appelée lors d'un clic:
Code:

1 2 3 4 5 6 A.prototype.maFonction=function(ev) { ev = ev || window.event; var mousePos = mouseCoords(ev); alert(this.arg); }
Notez bien le

Code:

alert(this.arg);

pour la suite, c'est cela qui pose problème.

Enfin, pour terminer, j'ai bien entendu une instruction qui ajoute l'écouteur à l'évènement de clic. Celle-ci est à l'intérieur d'une fonction de la classe A. Elle est programmée comme suit:

Code:

document.getElementById("monDiv").onclick = this.maFonction

Ainsi, maFonction est bien appelé, mais je n'arrive pas à accéder à l'attribut arg. J'ai une erreur de type arg est indéfini.

Y a-t-il quelque chose que je fais mal? Merci d'avance
19/12/2008, 15h47
le_chomeur
il faut passer par un pointeur :
Code:

1 2 3 4 var temp = this; ... = temp.tafonction;
19/12/2008, 16h48
muad'dib
Citation:
Envoyé par le_chomeur

il faut passer par un pointeur :

Code:

1 2 3 4 var temp = this; ... = temp.tafonction;
Déja essayé mais ça ne résoud rien à l'affaire :(
19/12/2008, 16h54
le_chomeur

as tu instancié ton objet ?

bonjour,

essaye comme ceci :

Code:

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
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
 
<!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">
<!-- 
var A = function() 
{
   this.arg = 5;
}
 
A.prototype = 
{
  maFonction : function(ev) 
  {
   alert(this.arg+" "+ev.type);
  }
  ,
  ajouteEv : function()
  {
    var fct = this;
    document.getElementById("monDiv").onclick = function(event)
                                                {
                                                event = (event?event:window.event); // POUR IE
                                                fct.maFonction(event);
                                                }
  }
}
 
function initObjet()
{
  var obj = new A();
  obj.ajouteEv(); // ajoute l'événement onclick au div
}
//-->
</script>
 
</head>
 
<body onload="initObjet()">
 
<div id="monDiv" style="border: 1px solid #000000; width: 200px">
bla bla bla bla bla bla bla bla bla bla 
bla bla bla bla bla bla bla bla bla bla 
bla bla bla bla bla bla bla bla bla bla 
bla bla bla bla bla bla bla bla bla bla 
bla bla bla bla bla bla bla bla bla bla 
bla bla bla bla bla bla bla bla bla bla 
</div>
 
 
</body>
</html>

pour le coup du paramètre event dans la fonction, cf. ce post

20/12/2008, 12h59
le_chomeur
pour moi il devait lui manquer cette partir :
Code:

1 2 3 var obj = new A(); obj.ajouteEv(); // ajoute l'événement onclick au div
( l'instanciation )