attachEvent, this non reconnu

**hakurou** · 12/07/2009, 23h32

Bonjour,

Je suis tombé sur un truc rigolo (ou pas), je viens de voir en travaillant une lib que IE n'interprète pas le "this" dans la situation suivante alors qu'avec l'equivalent addEventListener ca passe sans probleme :

Code :

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

1
2
3
 
obj.attachEvent("onclick", function(){document.title = this.innerHTML;}, true);
// IE plantera a cause de "this" et affichera undefined

J'ai tenté de faire quelque chose avec une closure et Apply mais du coup la fonction n'est plus enlevable avec les fonctions adéquates.

Ceci étant, je voudrai savoir s'il y a possibilité de le faire reconnaitre d'une façon ou d'une autre sur IE !

J'ai fais une page de base pour bien se rendre compte de la chose :

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
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
 
<html>
<head>
</head>
<body>
 
<div id="toto">kikou</div>
 
<script type="text/javascript">
 
// appellera la fonction lit() au click sur "toto" 
addEvent(document.getElementById("toto"), "click", lit);
 
 
function lit()
{
        // normalement, doit afficher le contenu de "toto" et enleve l'ecouteur
        // mais sur IE, ce fameux "this" n'est pas pris en compte
	alert(this.innerHTML);
	removeEvent(document.getElementById("toto"), "click", lit);
}
 
// fonctions pratiques
function addEvent(obj, ev, fct)
{
	if(obj.attachEvent)
	{
		obj.attachEvent("on" + ev, fct, true);
	}
	else
	{
		obj.addEventListener(ev, fct, true);
	}
}
 
function removeEvent(obj, ev, fct)
{
	if(obj.detachEvent)
	{
		obj.detachEvent("on" + ev, fct, true);
	}
	else
	{
		obj.removeEventListener(ev, fct, true);
	}
}
 
</script>
</body>
</html>

voila, la réponse est peut etre toute bete.

Merci d'avance

**franculo_caoulene** · 13/07/2009, 10h09

Salut,

Il faut plutôt utiliser ce genre de syntaxe

Code :

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

1
2
3
4
5
var fn = function(e) {
  var elm = e.target || event.srcElement;    //<-- détecte la source de l'évènement
  alert("action suite à un évènement en cours.");
  return false;
};

this que ce soit en utilisant addEventListener ou attachEvent ne retourne jamais l'élément en cours, mais plutôt l'objet window.

**hakurou** · 13/07/2009, 13h35

Je t'assure qu'en dehors de IE, "this" me renvoit l'élément courrant, tu peux tester avec le code que j'ai mis au dessus.
IE renvoit bien "window" par contre.

Sinon j'ai trouvé ce 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
21
22
23
24
 
function addEvent(obj, type, fn, par){
 
  if(obj.addEventListener){
 
    obj.addEventListener(type, function(event){        
 
      return fn.call(obj, event, par);
 
    }, false );
 
  }else if(obj.attachEvent){
 
    obj.attachEvent("on"+type, function(e){
 
      if (!e) var e = window.event;   
 
      return fn.call(obj, e, par);
 
    });
 
  }
 
}

C'est une façon sûre de procédé vu que l'on obtient ce que l'on cherche.
C'est quasiment ce que j'avais fait auparavant mais comme je disais, on ne peut pas retirer l'événement.
S'il n'y a pas d'autre façon de procéder, comment pourrait on faire, dans le cadre ou c'est un code similaire qui est utilisé, pour pouvoir retirer l'événement (detachEvent, removeEventListener) ?

**emmanuel.remy** · 13/07/2009, 13h48

Salut,

@hakurou: Dans le cas des événements traditionnels (onclick=...) le this de IE pointe bien vers l'élément du DOM concerné, mais par contre via attachEvent('onclick',... , le this pointe vers l'objet window.

Evidemment d'après le W3C, le this devrait toujours pointer vers l'élément...

ERE

**franculo_caoulene** · 13/07/2009, 13h49

J'ai essayé de faire un attachEvent à l'épreuve des balles, utilise plutôt la version courte qui est mieux.

**hakurou** · 13/07/2009, 14h28

Justement, j'étais en train de réfléchir sur l'idée de stocker les événements comme le font Mootools et YUI, et je vois que dans ton code tu les stocke dans un Array aussi, et en plus grâce a ca, ca fonctionne.

Je vous remercie de votre aide précieuse, passez une bonne journée !

attachEvent, this non reconnu

JavaScript

Discussions similaires

Partager

Partager