jQuery - 访问变量出了一个jQuery函数

Question

伙计们。我有这样的事情：

myThing = { 
    str:"my string", 
    setClick: function(){ 
     $("button").click(function(){ 
      alert(this.str); 
     }); 
    } 
} 

myThing.setClick(); 

问题是当我点击按钮的功能不知道什么是str。 alert(str)给我一个错误（str is not defined），并没有警报。 alert(this.str)给我的警报，但包含undefined。

我可以看到，this遭受按钮，而按钮没有任何属性str。那么我怎样才能访问jQuery功能之外的str呢？

Answer 1

保存在setClick到this参考引用对象，在click事件处理程序之外：

myThing = { 
    str:"my string", 
    setClick: function() { 
     var self = this; 
     $("button").click(function() { 
      alert(self.str); 
     }); 
    } 
} 

DEMO。

Answer 2

您可以随时名

myThing = { 
    str:"my string", 
    setClick: function(){ 
     $("button").click(function(){ 
      alert(myThing.str); 
     }); 
    } 
} 

myThing.setClick(); 

Answer 3

您可以使用javascript函数bind强制使用函数的上下文。我发现它可以用于这种情况。它允许您在绑定的函数内定义this的值。

myThing = { 
    str:"my string", 
    setClick: function(){ 
     $("button").click(function(e){ 
      // 'this' is myThing 
      // $(e.currentTarget) is the button on which the event handler was attached 
     }.bind(this)); 
    } 
} 

myThing.setClick();