Question

它是How to access the correct `this` context inside a callback?的副本，但根据我的问题描述，我无法在此处找到它。很多人可能会遇到同样的问题。

我有一个像这样的对象：

var my_object = new function() {

    this.function2 = function() {
        $("#button").click(function() {
           this.function1()
        })
    };

    this.function1 = function() {
    };

}

a = my_object()

如果我点击#button就会发生

this.function1不是函数

如何正确解决此问题？如何防止jquery覆盖我的“this”？

Answer 1

在jQuery中绑定事件处理程序时，回调内的this指的是触发事件的元素。

要在函数中设置this的值，请在函数上调用bind，传递您想要成为this的对象：

var my_object = new function() {

  this.function2 = function() {
      $("#button").click(function() {
         this.function1()
      }.bind(this)
  });

  this.function1 = function() {
  };

}

Answer 2

存储对this的引用，以避免混淆和上下文问题。

在事件处理程序this内是完全不同的东西..它是一个dom节点

var my_object = new function() {
    var self = this; // reference to `my_object`

    self.function2 = function() {
        $("#button").click(function() {
           // "this" is dom element returned by jQuery event handler
           // but "self" is already a stored reference to `my_object`
           self.function1()
           $(this).css('color','red')
        })
    };

    self.function1 = function() {
    };

}

Jquery在我的对象中覆盖了我的“this”

2 个答案: