Variable dans fonctions � cr�ation dynamique.

Version imprimable

23/06/2013, 23h14
nicolay1

Variable dans fonctions � cr�ation dynamique.

Bonjours,

Je voudrai savoir si vous connaissiez un moyen pour que la fonction plac� dans le tabDiv[i].onmouseover :

Code:

tabDiv[i].onmouseover = function(){mouseOver(i);};

devienne

Code:

function(){mouseOver(1);};

(ou

Code:

function(){mouseOver(2);};

,

Code:

function(){mouseOver(2);};

etc.) et fonction de i

? :D
24/06/2013, 01h39
SylvainPV
Je pense que ton probl�me vient du fait que la variable i est d�r�f�renc�e au moment de l'�v�nement mouseover. Du coup l'englober dans une fonction anonyme devrait faire l'affaire :
Code:

1 2 tabDiv[i].onmouseover = (function(_i){ return function(){mouseOver(_i);}; })(i);
24/06/2013, 08h06
nicolay1

Merci :) effectivement �a marche :) tu pourrais expliciter en d�tail le probl�me ou me renvoyer vers une page qui pourrait m'expliquer le probl�me ? Pour comprendre le fond du probl�me ^^' j'ai vachement du mal ac JS :'(
24/06/2013, 11h29
SylvainPV

C'est sans doute la partie la plus complexe de Javascript, les scopes et closures.

Voil� quelques liens :
Usage avanc� des fonctions JavaScript
http://www.coursweb.ch/javascript/closure.html
https://developer.mozilla.org/fr/doc..._en_JavaScript

Bonjour,

Peut-�tre plus compr�hensible:

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
<html>
  <head>
    <script type="text/javascript">
      function initialize(){
        var tabDiv = document.getElementsByTagName("div");
 
        // la closure
        function mouseOver(index){
            return function(e){
                console.log("i = " + index + ", id = " + this.id); // id du div
                console.log("event = " + e); // l'objet event
 
                // faire quelque chose ...
            }
        }
 
        for(var i = 0; i < tabDiv.length; i++){
          tabDiv[i].onmouseover = mouseOver(i);
        }
      }
 
 
    </script>
  </head>
  <body onload="initialize()">
    <div id="a">a</div>
    <div id="b">b</div>
    <div id="c">c</div>
    <div id="d">d</div>
    <div id="e">e</div>
  </body>
 
</html>

edit:
J'ai rajout� l'�v�nement retourn� par onmouseover (param�tre e de la fonction plus qu'anonyme). Plus sympa pour faire des choses

A+

24/06/2013, 14h07
Kaamo

Ou, ayant le m�me effet, utiliser .bind d'ECMAScript 5 :

Code:

tabDiv[i].onmouseover = function(_i){ return _i;}.bind(null, i);

:mrgreen:

Tu as donc le choix entre :
- la solution de Sylvain, on appelle �a une IIFE (Immediately Invoked Function Expression)
- celle de jlmag, on appelle �a une closure
- la mienne, utiliser le bind (Attention � la compatibilit� des navigateurs)
24/06/2013, 14h10
Auteur

Bonjour,

peut-�tre que ceci peut t'aider :
http://www.developpez.net/forums/d66...es-this-event/
24/06/2013, 22h53
nicolay1

Wow ^^ merci � vous :D