javascript - 用于循环的 Jquery 插件

Question

考虑到这段代码（我正在开发的 JQuery 插件的一部分）：

for (var counter = 1; counter <= 3; counter++) {
    var btn = $("<a></a>").addClass(class1)
                          .addClass(class2 + counter);
    btn.click(function() {
        $.fn.myPlugin.Click(counter);
    });
    myDiv.append(btn);
 }

我有 CSS 类（使其看起来像一个按钮）和一个单击事件调用我的插件函数之一btn的标签在哪里，其中包含我的 3 个创建的按钮。<a>countermyDiv<div>

问题是我<a>创建的所有标签都将调用该函数4作为参数，我不知道为什么。

Answer 1

可能有更好的方法来创建闭包，但是当我遇到这样的问题时，这就是我要做的。

for (var counter = 1; counter <= 3; counter++) {
    var btn = $("<a></a>").addClass(class1)
                          .addClass(class2 + counter);

    (function(b,c) {
        b.click(function() {
            $.fn.myPlugin.Click(c);
        });
    })(btn,counter);

    myDiv.append(btn);
 }

btn传入可能不是必需的，因为无论如何它都会通过引用传递。

Answer 2

这是一个如何处理循环中的闭包的示例。必须评估此工作的原因i，以便创建记录其当前值的函数。您可以以类似的方式在 for 循环中创建自己的 makeClickHandlerFunction。

var funcs = [];
for(var i = 0; i < 5; i++){
   var createFunc = function(x){
      return function(){console.log(x)};
   };
   funcs.push(createFunc(i));
}
funcs[0](); //logs 0
funcs[1](); //logs 1

Answer 3

我发现我可以用它来解决这个问题

btn.click({ arg: counter }, function(event) {
    $.fn.myPlugin.Click(event.data.arg);
});