1

我有 3.a和一个函数,它应该在-ed时提醒数字 [0, 1 or 2].a所属mouseover的数字:

​function a(){
    for(var c=0; c<3; c++){
        alert(c);
        $('.a:eq('+c+')').mouseover(function(){alert(c)});       
    }

}

当我执行它时,第一个alert(c)被触发了三次,消息分别为“0”、“1”、“2”,正如预期的那样。

但是,当 时mouseover .a无论.a是哪个,都会提示“3”

http://jsfiddle.net/f6tQn/

如果有人能解释为什么会发生这种情况并提供解决方案,我将不胜感激。

4

4 回答 4

5

因为c=3。

您的循环在C每次运行时加 1,C在代码运行后仍等于 3,从而为您的警报提供值C,即 3。

您的示例可以完全重写和简化为

$('.a').mouseover(function(){
    alert($(this).index());
});

这将为所有具有 class 的元素生成警报a,并给出它们在$('.a')生成的数组中的位置。

顺便说一句:将函数放入循环时出现 JSLint 错误,如果您想让 JSLint 满意,请查看此问题

于 2012-05-21T19:28:00.013 回答
1

你被 javascript 中的函数作用域变量抓住了。这是一个很大的 javascript 陷阱。

您需要创建一个函数来执行您希望 for 循环体执行的操作,并将 c 作为参数。

于 2012-05-21T19:29:03.380 回答
1

C 绑定到内存中的相同物理位置,因此当您使用鼠标悬停运行警报时,它会从最后一个设置值 3 中提取。

如果您想对该主题进行更深入的阅读,您实际上会在变量 c 上创建一个“闭包”。

试试这个

function a(){
    for(var c=0; c<3; c++){
        alert(c);
        (function(a){
           $('.a:eq('+a+')').mouseover(function(){alert(a)});
        })(c);      
    }

}
于 2012-05-21T19:30:26.270 回答
1

发生这种情况是因为您的每个mouseover函数都使用相同的 值c,即3循环完成时。

您需要关闭以“捕获”c每次迭代的值。

function a(){
    for(var c=0; c<3; c++){
        alert(c);
        var func = function(c){
            return function(){ // closes around the current value of "c"
                alert(c);
            };
        };
        $('.a:eq('+c+')').mouseover(func(c));       
    }
}

演示:http: //jsfiddle.net/vDbu3/

于 2012-05-21T19:35:35.353 回答