2011-03-08 38 views
0

我想知道是否有一个更简单的解决方案,我目前的解决方法。从父函数访问重写的变量

JavaScript示例:

var data= { 
    'key1':'value1' 
}; 

$.each(data,function foo() { 
    alert(this); //alerts 'value1' 
    $('#element').click(function()) { 
    alert(this); //alerts something else 
    } 
}); 

解决的方式,这将是:

var data= { 
    'key1':'value1' 
}; 


$.each(data,function foo() { 
    alert(this); //alerts 'value1' 

    var this_original=this; 

    $('#element').click(function()) { 
    alert(this_original); //alerts 'value1' 
    } 
}); 

这解决了问题,但它是不是很干净。我想知道是否有一个很好的Javascript/jQuery方法来获取子函数内部的原始值。喜欢的东西:parentFunction.this

+1

恐怕你只是习惯于'var that = this;'在你的代码中。更详细的解释必然会遵循,但它与“this”是代码当前正在执行的对象的引用有关。一旦你进入点击功能,你已经转移到不同的上下文,并且“this”随之而来。 – lsuarez 2011-03-08 07:59:46

+0

jQuery的“代理”函数会以任何方式提供帮助吗? – Kranu 2011-03-08 08:00:27

+0

是的,但我不会推荐它,除非你真的需要这一层复杂性。其含义是你必须将事件处理程序作为你想要检索的上下文对象的成员,即在'data'下声明一个名为'onClick()'的成员函数。 – lsuarez 2011-03-08 08:04:24

回答

2

不要使用this,使用参数,而不是:

var data= { 
    'key1':'value1' 
}; 

$.each(data,function foo(idx,val) { 
    alert(val); //alerts 'value1' 
    $('#element').click(function() { 
    alert(val); //alerts 'value1' 
    }); 
}); 
+0

工作原理q =谢谢! – Kranu 2011-03-09 00:24:24

-1

使用jQuery.proxy。您可以使用以下代码:

var data= { 
    'key1':'value1' 
}; 

$.each(data,function foo() { 
    alert(this); //alerts 'value1' 
    $('#element').click($.proxy(function() { 
    alert(this); }, this); 
}); 
+0

该代码将无法按预期运行。它会提醒HTMLElement。 – lsuarez 2011-03-08 08:16:49

1

请使用Martin Jespersen的答案。然而...

使用jQuery的.proxy()功能的要求:

var data = { 
    "key1": "value1" 
}; 

$.each(data, function(i, obj) { 
    alert(this); //alerts 'value1' 
    this.onClick = function() { 
     alert(this); 
    } 

    $('#element').click($.proxy(this, "onClick")); 
}); 

这里是a fiddle example

请记住,您可能想要更改选择器,以确定绑定点击事件的位置,我确定。

+0

谢谢!我希望我能给你“辅助解决方案”点,但我所能做的就是+1 – Kranu 2011-03-09 00:24:04

+0

@Kranu那么,谁知道呢?稍后您可能会需要它来预料不到的。我在这里分享知识,而不是理智的绿色复选标记。 :] – lsuarez 2011-03-09 04:50:10