Javascript 参数不起作用的jQuery单击事件

我需要一些帮助。我试图遍历一些Json项，创建一些li，其中包含来自这些项的一些信息，但也为li附加了单击处理程序，但带有作为参数传递的值

问题是该参数的最后一个值设置为或列表中的li。从我搜索的内容中，我了解到它与javascript闭包有关，但似乎不知道如何修复它

我正在使用jQuery，下面是代码：

for (var i = 0; i < items.length; i++)
{
    // information that will be displayed for each video
    var entry = items[i];

    var title = entry.title;
    var image = entry.thumbnail.hqDefault;
    var id = entry.id;

    var li = $("<li class='video-single'>");
    li.append("<img src='" + image + "' alt='" + title + "'>");
    li.append("<h4>" + title + "</h4>");

    $(li).click(function() {
        displayPopUp(id);
    });

    ul.append(li);
}

for（变量i=0；i”）；
li.附加（“”）；
li.追加（“+标题+”）；
$（li）。单击（函数（）{
显示弹出窗口（id）；
});
ul.附加（li）；
}

有人能帮我修一下这个代码吗

---

向您致意，Marius。

为了将事件绑定到动态添加的元素，您需要按如下方式委派它：

for (var i = 0; i < items.length; i++)
            {
                // information that will be displayed for each video
                var entry = items[i];

                var title = entry.title;
                var image = entry.thumbnail.hqDefault;
                var id = entry.id;

                var li = $("<li class='video-single'>");
                li.append("<img src='" + image + "' alt='" + title + "'>");
                li.append("<h4>" + title + "</h4>");

                $(document).bind('click',li,function() {
                    displayPopUp(id);
                });

                ul.append(li);
            }

for（变量i=0；i”）；
li.附加（“”）；
li.追加（“+标题+”）；
$（文档）.bind（'click'，li，function（）{
显示弹出窗口（id）；
});
ul.附加（li）；
}

问题在于JS是函数作用域，因此闭包中的id是for循环中的最后一个id。要解决此问题，请使用forEach，以便在单独的范围内运行循环的每个迭代，例如

items.forEach(function (el, i) {
    // information that will be displayed for each video
    var entry = items[i];

    var title = entry.title;
    var image = entry.thumbnail.hqDefault;
    var id = entry.id;

    var li = $("<li class='video-single'>");
    li.append("<img src='" + image + "' alt='" + title + "'>");
    li.append("<h4>" + title + "</h4>");

    $(li).click(function() {
        displayPopUp(id);
    });

    ul.append(li);
});

items.forEach（函数（el，i）{
//将为每个视频显示的信息
var分录=项目[i]；
var title=entry.title；
var image=entry.thumbnail.hqDefault；
var id=entry.id；
var li=$（“
”）；
li.附加（“”）；
li.追加（“+标题+”）；
$（li）。单击（函数（）{
显示弹出窗口（id）；
});
ul.附加（li）；
});

您需要委托事件因为元素是动态创建的，所以您可以使用添加到

li

上的类，该类是视频单体：

$(document).on('click','.video-single',function() {
                        displayPopUp(id);
                    });

---

你可以阅读关于

$（li）

没有任何意义，也许你想要

$（'li'）

？我是说。。如果做得不对，jQuery需要的是类或元素，而不是整个标记<代码>变量li=$（“

”）应该是

$（'.video single'）

：），此时

$（li）

可以替换为

li

；）如果您想了解更多关于js范围和语言本身的信息，没问题。我建议大家看看道格拉斯·克罗克福德（Douglas Crockford）的一些视频，或者读他的书《JavaScript：好的部分》。