函数闭包中的javascript函数闭包

Question

我在使用以下代码时遇到了这个问题： http://jsfiddle.net/double0seven/z3Yr4/

var feedurl = "https://itunes.apple.com/nl/rss/topsongs/limit=25/xml";
var j, i, x;
$.getJSON("http://ajax.googleapis.com/ajax/services/feed/load?q=" + feedurl + "&v=1.0&num=-1&callback=?", function(data) {
    for (j = 0; j < 21; j += 1) {
        qt = j + ". " + data.responseData.feed.entries[j].title.replace('#', '');
        console.log(qt);
        li = $("<li/>").html(qt).appendTo('#ul1');
        $.getJSON("http://gdata.youtube.com/feeds/api/videos?q=" + qt + "&v=2&start-index=1&max-results=1&orderby=relevance&format=5&alt=jsonc&callback=?", (function(el) {
            return function(videoFeed) {
                for (i = 0; i < videoFeed.data.items.length; i += 1) {
                    entry = videoFeed.data.items[i];
                    track = qt;
                    var liid = liid += 1;
                    el.empty();
                    el.addClass("item");
                    el.attr('id', i);
                    el.attr('ytid', entry.id);
                    el.attr('titel', entry.title);
                    newdiv = $(document.createElement("div"));
                    newdiv.addClass("mod");
                    newdiv.append("<h3>" + qt + "<br></h3>");
                    el.append(newdiv);
                }
            };
        }(li)));
    }
})

这是它需要做的：

1. 从 RSS 提要中获取标题（作品）
2. 将它们（最多 20 个）放入无序列表中 - 注意按 nr 排序。 （作品）
3. 在 youtube api 上搜索每个标题一个不错的视频（作品）
4. 将一些信息放入创建的 li（作品）中（ytid 可以，标题也可以）
5. 它需要从外部/母函数中获取变量 qt 才能使用。 但是 - 它总是在行中获取最后填充的 qt 变量...

不知道为什么，我认为需要与另一个关闭有关。 但不确定。 我搜索了整个互联网，但没有任何线索。

感谢您的帮助。

Answer 1

发生的情况是，在您的外部循环中每次迭代都会更新 qt-reference，当对 Youtube API 的第一个 Ajax 响应完成时，外部循环已经结束。

您必须将每个 qt 引用与每个内部 Ajax 请求一起存储，以便请求将更新相关的 LI。

最简单的方法是创建一个函数，该函数返回一个使用外部函数参数的函数：

var renderLi = function (qt, el) {
    return function(videoFeed) {
        ...
    };
};

...

$.getJSON("http://gdata.youtube.com/feeds/api/videos?q=" + qt + "&v=2&start-index=1&max-results=1&orderby=relevance&format=5&alt=jsonc&callback=?", renderLi(qt, li));

http://jsfiddle.net/z3Yr4/24/