jquery和javascript'；s闭包

我有下面的代码，javascript的闭包和匿名函数让我头疼

for (var i = 0, len = sites.length ; i < len ; i++)
{
  $("#thumb"+i).click(function() { $("#shader").show(); $("#thumbInfo"+i).show(); alert("#thumbInfo"+i); });
  $("#thumbInfo"+i+" .xbutton").click(function() { $("#shader").hide(); $("#thumbInfo"+i).hide(); });
}

for（变量i=0，len=sites.length；i

由于闭包，i始终为5（sites数组有5个元素），因此所有单击处理程序都引用相同的id

---

任何解决方法？

您都可以使用jQuery的循环

---

您可以始终使用jQuery的循环

var len=sites.length；
对于（变量i=0；i

你可能给我分配了5个

var len=sites.length；
对于（变量i=0；i

---

你可能给我分配了5个

在迭代中使用闭包：

for (var i = 0, len = sites.length ; i < len ; i++)
{
    (function(i) {
        $("#thumb"+i).click(function() {
            $("#shader").show(); 
            $("#thumbInfo"+i).show(); 
            alert("#thumbInfo"+i); 
        });
        $("#thumbInfo"+i+" .xbutton").click(function() { 
            $("#shader").hide(); 
            $("#thumbInfo"+i).hide(); 
        });
    }(i));
}

for（变量i=0，len=sites.length；i

在迭代中使用闭包：

for (var i = 0, len = sites.length ; i < len ; i++)
{
    (function(i) {
        $("#thumb"+i).click(function() {
            $("#shader").show(); 
            $("#thumbInfo"+i).show(); 
            alert("#thumbInfo"+i); 
        });
        $("#thumbInfo"+i+" .xbutton").click(function() { 
            $("#shader").hide(); 
            $("#thumbInfo"+i).hide(); 
        });
    }(i));
}

for（变量i=0，len=sites.length；i

将返回函数并由

i

参数化的函数放置在循环外部。JSLint将鼓励您这样做，有些人可能会发现它更易于引导

function make_fn1(i) {
    return function() { $("#shader").show(); $("#thumbInfo"+i).show(); };
}
function make_fn2(i) {
    return function() { $("#shader").hide(); $("#thumbInfo"+i).hide(); };
}
for (var i = 0; i < sites.length ; i++)
{
    $("#thumb"+i).click(make_fn1(i));
    $("#thumbInfo"+i+" .xbutton").click(make_fn2(i));
}

---

将返回函数并由

i

参数化的函数放在循环外部。JSLint将鼓励您这样做，有些人可能会发现它更易于引导

function make_fn1(i) {
    return function() { $("#shader").show(); $("#thumbInfo"+i).show(); };
}
function make_fn2(i) {
    return function() { $("#shader").hide(); $("#thumbInfo"+i).hide(); };
}
for (var i = 0; i < sites.length ; i++)
{
    $("#thumb"+i).click(make_fn1(i));
    $("#thumbInfo"+i+" .xbutton").click(make_fn2(i));
}

---

否，闭包允许访问父变量

i

，在调用

click（）

事件时，该变量已设置为

5

。我可以证明此答案不正确。我将把它留在这里供参考。不，闭包允许访问父变量

I

，在调用

click（）

事件时，该变量已设置为

5

。我可以证明此答案不正确。我将把它留在这里作为参考。如果你展开循环（用

I

hardcoded替换它五次），它能工作吗？我觉得

I

不是问题所在。如果展开循环（用

I

hardcoded替换它五次），它能工作吗？我觉得我不是问题所在。

function make_fn (i,showhide) {
    return function() { $("#shader, #thumbInfo"+i)[showhide]() };
}
for (var i = 0; i < sites.length ; i++)
{
    $("#thumb"+i).click(make_fn(i,'show'));
    $("#thumbInfo"+i+" .xbutton").click(make_fn(i,'hide'));
}