Javascript 将JQuery事件分配给自定义对象方法

我正在使用JQuery Mobile创建一个应用程序，但JQuery事件的结构存在问题。我定义了这样一个虚拟类：

MyClass = function()
{
    this.property = initvalue;

    this.foo = function()
    {
        alert("That's my property = " + this.property);
    }
}

然后我基于MyClass定义了一个对象：

var obj1 = new MyClass();

当我使用obj1.foo作为回调函数来通知事件时，就会出现问题，例如：

$(element).click(obj1.foo);

或

当执行foo时，它引用的是元素，而不是对象obj1，当然我不能使用自引用访问对象的属性。如何修复它？

您可以将该方法应用于其实例：

$(element).click(obj1.foo.bind(obj1));

.bind方法返回一个函数，因此您仍在将函数传递给jQuery方法，但该函数的上下文将绑定到您传递给.bind的任何对象

如果需要支持较旧的浏览器，可以使用先前链接到的MDN文章中给出的polyfill，也可以使用jQuery方法。

可以使用jQuery的代理方法：

---

这会将obj1上下文分配给您的方法。

您可以将单击事件绑定到一个匿名函数，该匿名函数在对象上下文中引用该方法的缓存版本

var myClass = this;
$(element).click(function () { myClass.foo(); });

一般来说，使用此方法比使用库提供的选项（如$.bind、$.proxy和u.bind）更为有效，尽管在您当前的示例中，我认为性能是可比的。看

$(element).load(URL, $.proxy(obj1.foo, obj1));

var myClass = this;
$(element).click(function () { myClass.foo(); });