JavaScript：如何绑定方法？

JSFiddle：

我的目标是制作一个可以使用和分发的模块。因此，我不能污染全局名称空间。我正在制作的模块也将在一个网页上多次使用。这就是为什么我选择使用OOP，但这带来了一个问题

我希望我的对象绑定一个函数，以便在用户单击DOM中的元素时运行。在我制作的这个简化示例中，我希望在用户单击段落时弹出一个警告框。例如，在我正在处理的实际项目中，我需要做的一件事是：用户单击画布，函数计算出用户单击的位置，并将其保存到this.clientX和this.clientY

而不是做

this.bind = function() {
    $("p1").bind('click', function() {
        // code here
    });
}

我想如果我这样做的话，它会起作用的：

this.bind = function() {obj.codeMovedToThisMethod()}

问题是这不是一个好的设计。在“类”中，您不需要知道将由该“类”构成的对象的名称。当我创建“类”的多个对象时，这并没有变得更好

所以我想我能做到

$("p1").bind('click', function(this) {
        // code here
    });
}

但它不起作用，因为将它发送到函数中并不像我所想的那样起作用

我应该如何解决这个问题？ 这里是一个简化的示例问题。（与JSFiddle相同。）

谢谢

阅读。因为它是一个关键字，所以不能将其用作参数名

使用其中一个

this.bind = function() {
    var that = this;
    $("#p2").on('click', function(e) {
        that.alert();
        // "this" is the DOM element (event target)
    });
}

或者，jQuery跨浏览器相当于以下功能：

this.bind = function() {
    $("#p2").on('click', $.proxy(function(e) {
        this.alert();
    }, this));
} 

---

你知道jQuery是如何做到这一点的吗？是的，

proxy

是jQuery对本机功能的变通方法（或者说“facade”），它创建了一个带有预定义上下文对象的函数，因此代理将对象作为参数抛出。我想这一点解释得很好。然而，我并不真正推荐使用它，因为它不寻常（因此令人困惑），每个人都希望

this

成为事件处理程序中的事件目标？我们在.proxy方法中使用它作为参数，不是吗？

this.bind = function() {
    $("#p2").on('click', $.proxy(function(e) {
        this.alert();
    }, this));
}