Question

使用jQuery将函数绑定到元素时遇到了一些困难。基本上我有一组使用JSON加载的div。每个JSON项都有一个关联的“动作”，它定义了单击该div时要调用的函数。

当我遍历每个JSON项目时，我这样做（为了清晰起见而编辑）：

for (var i = 0; i < JSONOBJECT.length; i++) {
   var divbox = $('<div id="' + i + '"><img /></div>');

   var action = JSONOBJECT[i]["action"];
   $(divbox).click(function () {
      eval(action); // bind function
   });

   $('.navigationarea').append(divbox); // Append to area
}

例如，JSONOBJECT[0]["action"]可以包含"doThis()"，而JSONOBJECT[1]["action"]可以包含"doThis2()"。

问题是action总是最终成为与JSON对象中最后一项相关联的操作。我知道这是一个与本地化变量（或制作副本？）相关的问题，但我很想念它。

我可以得到一些帮助吗？提前谢谢。

Answer 1

您的问题是action变量由所有匿名方法共享。

在您的具体情况下，最佳解决方案是撰写divbox.click(new Function(action)) 这也会更快，因为代码只会被解析一次，而不是每次点击一次。

通常，解决方案是将包含匿名函数的代码放入单独的函数中，并将该变量作为参数传递给单独的函数。

编辑：您的代码可以像这样重写：

for (var i = 0; i < JSONOBJECT.length; i++) {
    $('<div id="' + i + '"><img /></div>')
        .click(new Function(JSONOBJECT[i].action))
        .appendTo($('.navigationarea'));
}

订购jQuery绑定到元素？

1 个答案: