Dynamiquement définir des événements et la fermeture

Question

Ceci est une question de suivi à ma précédente one: j'ai cet objet:

var myObject { 
init: function(){ 

     for (var i = 0; i <3; i++) { 
      image = new Image(); 
. 
. 
. 
      image.onmouseover = this.Fade(this, 70, 100,1); 
      image.onmouseout = this.Fade(this, 100, 70,0); 
     } 
    }, 

SetOpacity: function (eID, opacity){     
     eID.style.opacity = opacity/100; 
     eID.style.filter = 'alpha(opacity=' + opacity + ')'; 
    } , 
    fade: function (eID, startOpacity, endOpacity){    
     var timer = 0; 
     if (startOpacity < endOpacity) { 
      for (var i = startOpacity; i <= endOpacity; i++) { 
      (function(opacity) { 
       setTimeout(function() {SetOpacity(eID, opacity);}, timer * 30); 
      })(i); 
      timer++; 
      }  
     }    
    } 
} 

Ai-je besoin de définir des fermetures sur les événements?

Answer 1

Oui.

Sinon, la variable image sera partagée par les trois gestionnaires de souris, et toutes les animations arriveront à la dernière image (même si vous passez la souris sur une image différente). En outre, dans votre rappel setTimeout, vous devez écrire MySlideshow.setOpacity.

EDIT: Votre code (image.onmouseover = this.Fade(this, 70, 100,1)) est appeler la méthodeFade et en attribuant la fonction qu'elle retourne à la propriété onmouseover. Puisque la méthode Fade ne renvoie pas de fonction, cela ne fonctionne pas. Vous devez le remplacer par image.onmouseover = function() { MySlideShow.Fade(this, 70, 100, 1); };.
Cela ne fonctionnera pas comme prévu, sauf si vous le mettez dans une fonction distincte.