Evenement onload et méthode d'objet

Version imprimable

Bonjour,

J'ai un petit souci avec les evenements en JS.

En effet j'ai attaché une méthode d'un objet perso à l'evenement onload de window. Jusque la tout va bien, mon evenement se déclenche, et appelle ma méthode.

Cependant lorsque j'examine le contexte d'execution de ma fonciton, je me retrouve dans window, et non l'instance d'objet à laquelle j'ai attaché l'evenement.... Et la je bloque sévére.

Le bout de code en question :
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 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Untitled Document</title> </head> <script language="javascript" type="text/javascript"> function r() { this.toto = "r"; this._onload = function( e ) { for( var n in e ) document.body.innerHTML += n+" = "+e[n]+"<br/>"; if( this == t ) alert("Et si c'était vrai...."); if( this == window ) alert(".... le drame"); } } var t = new r(); if( window.attachEvent ) window.attachEvent("onload", t._onload); else if( window.addEventListener ) window.addEventListener("load", t._onload , false); </script> <body> </body> </html>
A cause de ce comportement, auquel je ne m'attendais pas, je suis dans l'incapacité de retrouver l'instance de mon objet... Ce qui est problèmatique vu que je voulais lui faire executer quelques méthodes.

Merci par avance,

kaymak

bonjour,

j'ai supprimé

Code:

1
2
3
4
5
 
	if( window.attachEvent )
		window.attachEvent("onload", t._onload);
	else if( window.addEventListener )
		window.addEventListener("load", t._onload , false);

voilà ton code que j'ai modifié :

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
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<script language="javascript" type="text/javascript">
	function r()
	{
		this.toto = "r";
		this._onload = function( e )
		{
		    var data="";
                    var n;
			for( n in e )
				data += n+" = "+e[n]+"<br/>";
			document.body.innerHTML = data;
 
			if( this == t )
				alert("Et si c'était vrai....");
			if( this == window )
				alert(".... le drame");
		}
	}
 
	var t = new r();
 
/** Debut modification **/
   if (document.all==null)
	   onload = function(event){t._onload(event)};  //Firefox
    else
  	   onload = function(){t._onload(event)};   //IE
/** Fin modification **/
</script>
<body>
</body>
</html>

Pour la boucle for j'ai ajouré une variable data : en effet le innerHTML dans la boucle faisait ramer Firefox. Et j'ai déclaré n en dehors de la boucle (parce que je préfère).

Ca marche pour firefox et IE pour safari, je ne sais pas :(

Salut,

Ta solution fonciton en effet. Mais elle ne me plait guère car il faudrait enregistrer tous les objets et leurs handlers respectifs pour déclencher un evenement.

du coup j'ai regarder un peu ce qui se faisait ailleurs, et j'ai vu la librairie de yahoo qui justement permet de régler ce problème.

Voici ce que cela donne.
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 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Untitled Document</title> </head> <script language="javascript" type="text/javascript" src="yahoo/yahoo-min.js"></script> <script language="javascript" type="text/javascript" src="event/event-min.js"></script> <script language="javascript" type="text/javascript"> function r() { this.toto = "r"; this._onload = function( e ) { for( var n in e ) document.body.innerHTML += n+" = "+e[n]+"<br/>"; if( this == t ) alert("Et si c'était vrai...."); if( this == window ) alert(".... le drame"); } } var t = new r(); YAHOO.util.Event.addListener(window, "load", t._onload, t, true); </script> <body> </body> </html>
ela me parait assez clair, sauf pour le dernier parametre. En fait c'est justement ce parametre qui va permettre de modifier le scope d'execution de la méthode appelée.
En mettant true, j'indique ici que je souhaite que la méthode s'execute dans le scope dela variable t, autrement ce sera sur le scope par défaut c'est à dire cette satanée window.

voila bye