jquery - 为刚刚创建的 li 元素绑定不同的函数

Question

我动态创建li元素：

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

li_id是一个数组值，它返回 li 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()它显示数组的最后一个元素的id，而lids不是1,2,3...[...]，就像语句console.log()之外...$

Answer 1

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

或者

循环内的 JavaScript 闭包——简单实用的示例

给定您的 HTML，可以通过两种方式编写代码。

使用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));

但这仅在您需要将循环的值传递给函数时才需要。