title: "this" keyword in event methods when using JavaScript prototype object
body: <p>I'm trying to access the member variables of a prototype class in JavaScript in an event handler -- something I'd typically use the "this" keyword for (or "that" [copy of this] in the case of event handlers). Needless to say, I'm running into some trouble.</p>
  
  <p>Take, for example, this HTML snippet:</p>
  
  <pre><code>&lt;a id="myLink" href="#"&gt;My Link&lt;/a&gt;
  </code></pre>
  
  <p>And this JavaScript code:</p>
  
  <pre><code>function MyClass()
  {
    this.field = "value"
    this.link = document.getElementById("myLink");
    this.link.onclick = this.EventMethod;
  }
  
  MyClass.prototype.NormalMethod = function()
  {
    alert(this.field);
  }
  
  MyClass.prototype.EventMethod = function(e)
  {
    alert(this.field);
  }
  </code></pre>
  
  <p>Instantiating a MyClass object and calling NormalMethod works exactly like I expect it to (alert saying "value"), but clicking the link results in an undefined value because the "this" keyword now references the event target (the anchor () HTML element).</p>
  
  <p>I'm new to the prototype JavaScript style, but in the past, with closures, I've simply made a copy of "this" in the constructor:</p>
  
  <pre><code>var that = this;
  </code></pre>
  
  <p>And then I could access members variables in event methods via the "that" object. That doesn't seem to work with prototype code. Is there another way to achieve this?</p>
  
  <p>Thanks.</p>