JavaScript "this"在事件处理程序中引用了错误的对象

Question

我正在使用 Prototype 编写一些 MVC JavaScript 代码。问题是，当我在下面的代码片段中引用 this 时，它当然会引用 Window 对象，而我需要它来引用我的 Controller 实例，以便它可以调用我的 updateValue 函数，传递 HTML 元素 ID。

我想我必须使用 bind或 bindAsEventListener但我真的不明白该怎么做。

var Foo = {
  Controller: Class.create({
    observeEvents: function() {
      $$("#myform input").each(function(input) {
        input.observe("blur", this.updateValue(input.id); // <- wrong this!
      });
    },

    updateValue: function(elementID) {
      ...
    }
  })
}

如有任何帮助，我们将不胜感激。

Answer 1

这应该有效。

    observeEvents: function() {
      var Controller = this;
      $$("#myform input").each(function(input) {
        input.observe("blur", Controller.updateValue.bind(Controller, input.id));
      });
     ...

如果您不想学习如何使用 bind(坦率地说，我不怪您)那么您可以忘记它，只需使用另一个小闭包即可。

    observeEvents: function() {
      var Controller = this;
      $$("#myform input").each(function(input) {
        input.observe("blur", function(event) {
                                Controller.updateValue(input.id);
                              });
      });
     ...