循环体内,绑定事件函数,怎么取i对应的值?

吾爱 发布于 2013/05/03 11:29
阅读 596
收藏 0

<html>
    <head>
        <script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.9.0.min.js" type="text/javascript"></script>
        <script>
            var json={
                "l1":{"color":"red"},
                "l2":{"color":"blue"}
            }
            $(function(){
                for(i=1;i<=2;i++){
                    (function(i){
                        o=eval("json.l"+i);
                        $("a").eq(i-1).mouseover(function(){$(this).css('color',o.color)})
                    })(i)
                }
            })
        </script>
    </head>
    <body>
        <a href="">111</a>
        <a href="">222</a>
    </body>
</html>

结果鼠标放到111和222,颜色都会变成blue,我是想让111变红色的

也就是mouseover里绑定的匿名函数中,o.bg取到的值是for遍历到最后的那个值,而不是当前遍历时的值

加载中
0
thREam
thREam
for(var i=1;i<=2;i++){
     (function(i){
          o=eval('json.li'+i);
         $("#li"+i).mouseover(function(){$(this).css("background-color",o.bg)});
     })(i);
}
吾爱
吾爱
不行啊,这样试过了还是跟之前一样
吾爱
吾爱
能帮我解释一下吗?这是什么写法以及原理呢?
0
保密保密
保密保密

(function(){})(),这种写法是定义一个匿名函数,并且执行..

例如:申明一个匿名函数,并且执行
(function(){alert('123')})();


申明一个变量函数,调用后执行
var func=function(){
    alert('123');
}
func();//调用

i,就是给这两个li 都创建了mouseover方法

吾爱
吾爱
我把完整的代码贴上去了,可以帮忙测试下吗?按楼上写的无效。
0
Maxint64
Maxint64

这样应该可以 原理的话……就是js所谓的闭包吧 我js不是很懂 说不清楚 具体可以google一下

或者参考下这个 http://james.padolsey.com/javascript/closures-in-javascript/

var json={
     "l1":{"color":"red"},
     "l2":{"color":"blue"}
 }
$(function() {
    for (i = 1; i <= 2; i++) {
        o = eval("json.l" + i);
        $("a").eq(i - 1).mouseover(function(o) {
            return function() {
                $(this).css('color', o.color)
            }
        } (o))
    }
})


0
鸿尘
鸿尘
for(i = 1; i <= 2; i++) {
   (function(){
      // for循环体作用域中i是变化的,要及时赋值给闭包函数中声明的变量j来保存
      var j = i;
      var o = eval("json.l" + j);
      $("a").eq(j-1).mouseover(function(){
           $(this).css('color', o.color);   
         });
    })();
}
吾爱
吾爱
感谢!
blindcat
blindcat
mark
0
秋雨梧桐
楼主这么写已经考虑了闭包的问题了,问题在于  o = eval("json.l" + j);  没有用VAR 来声明,这个变量就属于window的属性,而o是在mouseover事件里才读取,这时候2个锚点读取的是同一个对象o的color属性。所以都是蓝色,这里只需要 加上 var  o = eval("json.l" + j)就可以了
吾爱
吾爱
精辟
0
戴威
戴威
不用eval可以吗?
0
秋雨梧桐
(function(i){

})(i)

(function(){
    var j = i;

})()

这2种写法效果一样



吾爱
吾爱
谢谢
返回顶部
顶部