结合不同功能刚刚创建li元素

Question

创建动态li元素：

<ul> 
<li id="1">1</li> 
<li id="2">2</li> 
<li id="3">3</li> 
[...] 
</ul> 

li_id是一个数组值返回立ID（= 1,2,3 ...）

如何能我结合不同的功能，以每li元素在这样的代码：

for (li_id in lids) 
{ 
console.log(li_id);       
$(li_id).bind('mouseover', function() { 
console.log(li_id); 
}); 
} 

以上不起作用。如何正确写入？

随着live()代替bind()它显示lids数组的最后一个元素的id，不1,2,3 ... [...]，像console.log()的$语句外部...

Answer 1

鉴于你的HTML

http://www.mennovanslooten.nl/blog/post/62

或

JavaScript closure inside loops – simple practical example

，代码可以写在两个方面。

使用jQuery 1.4 Event.data参数：

var lids = [1,2,3]; 
for (i in lids) { 
    var li_id = lids[i]; 

    $('#' + li_id).bind('mouseover', { id: li_id }, function(ev) { 
     console.log(ev.data.id); 
    }); 
} 

或者创建具有匿名函数闭包：

var lids = [1,2,3]; 
for (i in lids) { 
    var li_id = lids[i]; 

    // an anonymous function 
    (function (id) { 
     $('#' + id).bind('mouseover', function() { 
      console.log(id); 
     });   
    })(li_id); // ...called every time with different id 

} 

我更喜欢在这种情况下jQuery Event.data方式。

Answer 2

因此，与封闭的正确答案应该是：

$(li_id).bind('mouseover', function(val) { 
          return function() { 
           console.log(val); 
          } 
          }(li_id)); 

但这只是需要如果你需要循环的值传递到函数。