Mootools - Lier à une instance de classe et à un objet d'événement d'accès

Question

J'ai un composant qui déclenche un événement onFocus. J'affecte une méthode de classe pour gérer l'événement onFocus. Dans le gestionnaire d'événements, j'ai besoin d'accéder à la fois à l'instance de classe et à l'objet événement lui-même.

Cependant, lorsque j'utilise .bind (this), je ne peux plus obtenir l'objet événement car la portée est maintenant changée en instance de classe. Et si je n'utilise pas .bind (ceci) je peux accéder à l'objet événement, mais pas à l'instance de classe.

Je suis sûr qu'il existe une solution, mais je n'ai pas été en mesure de comprendre cela. Des idées?

Merci.

new Class({ 
    handleComponentFocus : function() { 
     // this refers to the class instance 
     // I would also like to get the event information as well, but can't now that the scope has been changed  
    }.bind(this) 

    this.pickList = new BasePickList({ 
     onFocus : this.handleComponentFocus 
    }); 
}) 

Answer 1

pouvez-vous poster plus? fondamentalement - un squelette pour la classe ainsi que la fonction où vous appelez une nouvelle instance de BasePickList. BasePickList source ne ferait pas de mal à voir comment l'événement est déclenché.

maintenant, vous n'avez pas besoin de faire envelopper la méthode de classe avec un .bind(this), il le fait automatiquement. comme pour les événements, dépend de ce qui les déclenche, s'il s'agit d'un champ de saisie, il doit transmettre l'événement original que vous pouvez capturer via handleComponentFocus: function(e) { où e sera l'objet événement.

cela peut être waaay hors de ce que vous essayez de faire, mais il peut vous donner quelques idées http://www.jsfiddle.net/dimitar/KdhvG/

vérifier la sortie de la console lorsque vous vous concentrez sur le terrain - il passe sur le contrôle à la méthode handleComponentFocus avec l'événement object (complet avec event.target qui pointe vers la case à cocher) ainsi qu'une portée de l'instance de classe.

<input type="checkbox" id="foo" /> 

et

var banana = new Class({ 
    Implements: [Events, Options], 
    initialize: function(options) { 
     this.setOptions(options); 
     this.element = document.id(this.options.element); 
     this.element.addEvents({ 
      focus: function(e) { 
       this.fireEvent("focus", e); 
      }.bind(this) 
     }); 
    } 
}); 

var foo = new Class({ 
    handleComponentFocus: function(e) { 
     console.log(e); 
    }, 
    initialize: function() { 
     this.picklist = new banana({ 
      element: "foo", 
      onFocus: this.handleComponentFocus 
     }); 
    } 
}); 

new foo();