[IE] Boucle for, truc de fou

Version imprimable

Bonjour à tous,

Ca fait une heure que j'essaye de débugger ce satané code IE.
Tout fonctionne sous FF comme d'hab.
Sous IE 7, c'est surprenant !

Voici mon code optimisé IE :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 var tab=new Array(); var tab_img=new Array('ac', 'pk', 'bp', 'ht'); function zoom(container, maxWidth, maxHeight, minWidth, minHeight){ for(var i=0; i<tab_img.length; i++){ tab[i]=false; var newimg=document.createElement('img'); newimg.setAttribute('src', 'img/'+tab_img[i]+'.gif'); newimg.setAttribute('id', 'img'+i); newimg.style.setAttribute('cssText', 'width:'+minWidth+'px; height:'+minHeight+'px;'); newimg.setAttribute("onclick", function(){alert('Play '+i);}); document.getElementById(container).appendChild(newimg); } } window.onload=function(){ zoom('area', 68, 107, 34, 54); }
Dans mon HTML, j'ai juste

Code:

<div id="area"></div>

Donc toutes mes images ont un onclick="alert('Play 4');" !!?
C'est fou.. je me suis lu et relu. Je vois pas où j'ai merdé.

Bonjour,

Code:

1
2
3
4
5
6
7
var newimg=document.createElement('img');
newimg.setAttribute('src', 'img/'+tab_img[i]+'.gif');
newimg.setAttribute('id', 'img'+i);
newimg.style.setAttribute('cssText','width:'+minWidth+'px;height:'+minHeight+'px;');
newimg.setAttribute("onclick", function(){alert('Play '+i);});
document.getElementById(container).appendChild(newimg);
document.getElementById('img'+i).onclick = function(){alert('Play '+i);};

A+

13/12/2007, 13h36
Shinuza
Euh, à moins que je ne me trompe, ça ne changera rien. Javascript étant synchrone c'est la dernière valeur de la boucle qui sera affectée à tous les élements.
Code:

1 2 3 4 5 document.getElementById('img'+i).onclick = function(num) { return function(){ alert('Play '+num); }; }(i);

j'ai déja collé un truc sur ça dasn la FAQ ...

Code:

1
2
3
4
5
6
7
8
9
10
11
 
for(var i=0; i<tab_img.length; i++){
		tab[i]=false;
		var newimg=document.createElement('img');
		newimg.src= 'img/'+tab_img[i]+'.gif';
                newimg.indice=i;
		newimg.id='img'+img.indice;
		newimg.style.cssText='width:'+minWidth+'px; height:'+minHeight+'px;';
		newimg.onclick=function(){alert('Play '+this.indice);});
		document.getElementById(container).appendChild(newimg);
	}

13/12/2007, 14h24
E.Bzz

Citation:

Envoyé par SpaceFrog

j'ai déja collé un truc sur ça dasn la FAQ ...

Il me semblait, mais j'ai pas retrouvé :oops:
13/12/2007, 14h30
SpaceFrog

ou dans les contributions ?
13/12/2007, 14h33
d-Rek

Il n'y a que la méthode Shinuza qui fonctionne..
Merci les mecs !

Bon désolé mais je donne le point à Shinuza.

Oui bon une paire de coquilles dasn le script ...

mais ça marche ... pour preuve :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<script type='text/javascript'>
function MyRandomMess(){
var tab_img=new Array(10); 
 
for(i=0; i<tab_img.length; i++){
		var newimg=document.createElement('div');
       newimg.indice=i;
		newimg.id='img'+newimg.indice;
		newimg.style.cssText='width:100px; height:100px;backgroundColor:red;border:solid 2px blue;';
		newimg.onclick=function(){alert('Play '+this.indice)};
		document.getElementById('container').appendChild(newimg);
	}
}
</script>
</head>
 
<body onload="MyRandomMess()">
<div id="container"></div>
</body>
 
</html>

13/12/2007, 15h31
d-Rek

En recopiant ton code intégralement, j'avoue que ça fonctionne.
J'ai du oublier quelque chose en modifiant mon script tout à l'heure..

Je split le point donné Shinuza et je t'en file la moitié.:calin:
13/12/2007, 15h38
Shinuza

Juste un truc, écrire dans les propriétés d'un HTMLElement est une des premières causes de leak sous IE. D'ou l'intérêt du bind ici, ou l'utilisation de forEach qui est un parfait walk-around pour ce genre de cas (et ça permet une approche un peu plus orientée "fonctionnel")
13/12/2007, 15h42
SpaceFrog

ou éventuellement d'utiliser Firefox ? :mouarf3:
13/12/2007, 19h56
d-Rek

Suite à cette recherche, mon mentor m'a expliqué certaines choses vraiment balèze.. notamment à propos du bind
Me voilà moins bête. :lol:

Fin bon.. comme dirait SpaceFrog :

Citation:

Envoyé par SpaceFrog

Deux règles du succès:
1) Ne communiquez jamais à quelqu'un tout votre savoir...