Question

我在jQuery插件中使用此代码：

setInterval(function() {                        
   localStorage.setItem("flag", "set");
   var data = $(this).serializeArray();
   console.log($(this));
   $.each(data, function(i, obj) {
      localStorage.setItem(obj.name, obj.value);
   });
   console.log('saved');
   console.log(localStorage);                       
}, 5000);

if (localStorage.getItem("flag") == "set") {
   alert("This form has saved data!");
   var data = $(this).serializeArray();
   console.log($(this));
   $.each(data, function(i, obj) {
      $("[name='" + obj.name +"']").val(localStorage.getItem(obj.name));
   });                      
}

现在奇怪的是，第一个$(this)包含表单（运行插件），但第二个$(this)包含DOMWindow。为什么两个$(this)包含不同的东西？是因为第一个是setInterval吗？

Answer 1

是的，你的setInterval声明中有一个匿名函数（一个没有名字的函数），它创建了自己的范围。

第一个console.log($(this))可以访问任何全局或其中设置的任何内容，第二个console.log($(this))只能访问全局变量（正如您所知，this在全局范围内是window对象。

Answer 2

您可以使用简单的闭包，也可以使用$.proxy：http://api.jquery.com/jQuery.proxy/

var repeat = function() {                        
    localStorage.setItem("flag", "set");
    var data = $(this).serializeArray();
    .......
}

setInterval($.proxy(repeat, $("#form")), 500);

像这样......

Answer 3

不是它在setInterval内，而是在匿名函数内部。

第一个$(this)在匿名函数的范围内。第二个$(this)位于全球范围内。

Answer 4

this是对当前对象的引用。它代表一个函数的上下文。默认引用是全局引用（在我们的例子中是window对象）由于setInterval回调正在全局范围内执行，this将始终指向窗口对象。
以下示例说明this与范围之间的关联：

var a = "window";
function f(){
    console.log(this.a);
}
f();// scope = window
var obj = {a:'object',f:f};
obj.f();// scope = object

在jQuery中的setInterval中使用$（this）

4 个答案: