2010-06-08 3 views
1

J'ai un objet javascript qui a des variables définies et attache des gestionnaires d'événements. J'aimerais que les gestionnaires d'événements aient accès aux variables définies. Y-a-t-il un moyen de faire ça ? Les gestionnaires d'événements sont dans leur propre portée locale et n'ont donc pas accès aux variables d'objet. Existe-t-il un moyen de les transmettre sans utiliser de variables globales? J'ai une idée que les fermetures résoudraient cela mais je ne suis pas sûr de savoir comment.javascript - Transmission de paramètres supplémentaires dans un gestionnaire d'événements

Le code ci-dessous affichera le nom de l'objet lors du chargement de la page mais si vous cliquez sur l'objet map dom, il indiquera que le nom est indéfini.

Toute aide très appréciée.

Colm

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <title>Map Test</title> 
     <meta charset="utf-8" /> 
     <script type="text/javascript"> 
      window.onload = function() { 
       var e = new EvtTest(); 
       e.printName(); 
       e.attachEvents(); 
      }; 

      function EvtTest() { 
       this.name = "EvtTest"; 
      } 

      EvtTest.prototype.name = null; 

      EvtTest.prototype.attachEvents = function() { 
       var map = document.getElementById("map"); 
       map.addEventListener ('click', this.evtHandler, false); 
      }; 

      EvtTest.prototype.printName = function() { 
       console.log ("This Name : " + this.name); 
      }; 

      EvtTest.prototype.evtHandler = function (e) { 
       e.preventDefault(); 
       console.log ("Name : " + this.name); 
      }; 
     </script> 
     <style type="text/css"> 
      html, body { 
       height:100%; 
       width:100%; 
       margin: 0; 
       background-color:red; 
      } 
      #map { 
       height: 300px; 
       width: 300px; 
       background-color:yellow; 
      } 
     </style> 
    </head> 

    <body> 
     <div id="map"></div> 

    </body> 
</html> 

Répondre

2

Un peu de tripotage:

EvtTest.prototype.attachEvents = function() { 
    var that = this; 
    var map = document.getElementById("map"); 

    map.addEventListener ('click', function() { 
     that.evtHandler(); 
    }, false); 
}; 

maintenant this à l'intérieur evtHandler référence à l'objet que vous attendiez.

+0

Excellent - cela a bien fonctionné. Merci. – Protos

Questions connexes