Discussion :

[d-Rek]

Bonjour à tous,

C'est sûrement une question bête mais j'arrive pas à m'en sortir.
Je génère des éléments à la volée sur lesquels je définie des évènements comme ceci :

Code :

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

element.onmouseover=function(){maFonction(valeur1, valeur2);};

Seulement dans ma boucle, valeur1 et valeur2 sont incrémentées différemment.
Et le problème est qu'en fin de compte, tous les éléments ont la même valeur pour valeur1 et valeur2 soit valeur1 finale et valeur2 finale.

Il faut donc que je fixe ces valeurs à l'instant où je définie l'évènement.
Vous avez une idée ?

[Sh4dow49]

je n'ai pas très bien compris mais si tes valeurs ne sont pas des variables mais des valeurs en dur (dans le code montré) essaye de les mettre entre quote pour voir

[d-Rek]

Si, si, mes valeurs (valeur1 et valeur2) sont variables..

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
function go(){
	var valeur1=0, valeur2=0;
	var content=document.createElement('div');
	for(var i=0; i<10; i++){
		var cell=document.createElement('div');
		cell.onmouseover=function(){maFonction(valeur1, valeur2);};
		cell.id='div'+i;
		cell.style.border='1px solid #000000';
		cell.style.width='10px';
		cell.style.height='10px';
		content.appendChild(cell);
		valeur1=valeur1+5;
		valeur2=valeur2+7;
	}
	document.getElementsByTagName('body')[0].appendChild(content);
}
 
function maFonction(v1, v2){
	alert(v1+' ~ '+v2);
}

Après ça, toutes mes div font maFonction(50, 70); alors que par exemple div0 devrait faire maFonction(0, 0);

[Bovino]

Peut-être comme ça :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
for(var i=0; i<10; i++){
		var cell=document.createElement('div');
		content.appendChild(cell);
		cell.onmouseover=function(){maFonction(valeur1, valeur2);};
		cell.id='div'+i;
		cell.style.border='1px solid #000000';
		cell.style.width='10px';
		cell.style.height='10px';
		valeur1+=5;
		valeur2+=7;
	}

[Matthieu2000]

cell.onmouseover="maFonction("+valeur1+","+ valeur2+");}";

[Oscar Hiboux]

J'suis pas bien sûr d'avoir compris mais je peux déjà te mettre en garde vis-à-vis du contexte de tes variables (scope).

Lorsque tu fais ton branchement de fonction sur l'événement "mouseOver" tu définis une fonction qui dépend directement de tes variables "valeur1" et "valeur2" :

Code :

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

cell.onmouseover=function(){maFonction(valeur1, valeur2);};

Effectivement, la définition de ta fonction, anonyme, ne mentionne pas de paramètres. Lorsqu'elle sera appelée "valeur1" et "valeur2" seront alors recherchées en dehors du scope de ta fonction et elle retourneront leur valeur au présent. En l'occurence, "valeur1" et "valeur2" sont définies au même endroit que tu définis ta fonction, c'est à dire dans le bloc de la fonction "go".

Lorsque tu définis ces deux variables dans le cadre de ta fonction "go", elles n'existent que dans ce cadre (sauf si au niveau global tu en as défini d'autres, mais là ça se complique encore... ^^'). Ainsi, lorsque "go" est appelée, la p'tite tambouille se fait : "valeur1" et "valeur2" sont déclarées, une fonction anonyme est définie sur le tas et attribuée pour l'écoute d'événements et ensuite "valeur1" et "valeur2" prennent leurs valeurs finales, soit, en se basant sur ce que tu nous rapportes : 50 et 70.

Si tu veux que ta fonction d'écoute fasse référence à des valeurs "arrêtées à un moment donnée" il faut utiliser qqchose qui ressemble à ce que Matthieu2000 vient de l'écrire (je pense que ça ne marche pas ton truc Matt') :

Code :

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

cell.onmouseover = new Function("maFonction(" + valeur1 + ", " + valeur2");");

(si tu as besoin de déclarer des paramètres pour cette fonction il faut passer leurs noms sous forme de chaînes de caractères, un à la fois, en paramètres à l'appel à "new Function", avant le corps de la fonction)

"new Function" crée une fonction, avec pour corps le fragment que tu lui passes, sous forme d'une chaîne de caractères. Au moment où tu définis cette fonction, les valeurs de "valeur1" et "valeur2" sont alors arrêtées dans le temps.

J'espère que tu as compris au moins qq-chose dans tout ça; c'est un peu tordu...

[Matthieu2000]

(je pense que ça ne marche pas ton truc Matt') :

teste quand même des fois ca marche

[Oscar Hiboux]

Pour te faire plaisir j'ai testé

Code :

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

$("field").onmouseover = new Function("console.log('pouet');");

fonctionne alors que ce qui suit non :

Code :

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

$("field").onmouseover = "console.log('pouet');";

"onmouseover" comme tous ces callback doivent être des fonctions, ce n'est pas comme les attributes "href" des ancres :

Code :

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

anchor.href = "javascript:console.log('pouet');";

devrait fonctionner.

Ceci dit, utiliser les ancres pour introduire des intéractions dans une page n'est pas toujours la meilleure solution... ^^'

[d-Rek]

Code :

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

cell.onmouseover = new Function("maFonction(" + valeur1 + ", " + valeur2");");

Exact. Je connaissais plus la syntaxe pour prendre les valeurs à l'instant T.
Merci TigRoO°

[Oscar Hiboux]

De rien !