.each 函数中的 .getJSON答案

【问题标题】：.getJSON in .each function.each 函数中的 .getJSON
【发布时间】：2016-03-13 04:21:12
【问题描述】：

我希望在 .each 函数中嵌套一个 .getJSON 函数，以便将来自两个不同请求的数据绑定在一起。

我正在使用 Wistia 视频 api，并希望加载视频及其基本信息，并在“stats”JSON 中显示 play_count。

这是我尝试过的方法，但它不起作用——有什么建议吗？

var projectHashId = "3xom8bku3l";
var wistiaKey = "*hidden*";
var projectStats = "https://api.wistia.com/v1/stats/projects/" + projectHashId +".json?api_password=" + wistiaKey;
var projectMedias = "https://api.wistia.com/v1/projects/" + projectHashId + ".json?api_password=" + wistiaKey;

var total = 0

$.getJSON(projectMedias, function (data) {
    $.each(data.medias, function (i, v) {
        var name = v.name;
        var duration = v.duration;
        var hashedId = v.hashed_id;
        var thumb_orig = v.thumbnail.url;
        var thumb_size = "640x360";
        var thumb = thumb_orig.replace('100x60',thumb_size);
        var description = v.description + " / Created " + v.created;
        var wistiaKey = "*hidden*";
        var mediaStats = "https://api.wistia.com/v1/stats/medias/" + hashedId + ".json?api_password=" + wistiaKey;

        $.getJSON(mediaStats, function (data) {
            var loads = data.load_count;
            var plays = data.play_count;
            var engagement = data.engagement;
        });

        $('#insert-json-videos').append('<div class="col-lg-12 spacer"><div class="video"><img id="video-thumb" src="' + thumb + '"><div class="video-menu"><div class="video-desc"><div class="video-main">' + name + '</div><div class="video-sub"><span id="video-desc">' + description + '</span></div></div><div class="video-stats"><div class="video-main"><a href="stats"><span id="video-views">' + plays + '</span></a></div><div class="video-sub">total views</div></div></div></div></div>');
    })
});

【问题讨论】：

标签： jquery json each getjson

【解决方案1】：

您在最后一行中使用的某些变量只有在第二个getJSON 履行其承诺后才可用。所以将append 行放在第二个getJSON 函数中，这样它只会在该promise 也被解决后才会执行。

var total = 0

$.getJSON(projectMedias, function (data) {
    $.each(data.medias, function (i, v) {
        var name = v.name;
        var duration = v.duration;
        var hashedId = v.hashed_id;
        var thumb_orig = v.thumbnail.url;
        var thumb_size = "640x360";
        var thumb = thumb_orig.replace('100x60',thumb_size);
        var description = v.description + " / Created " + v.created;
        var wistiaKey = "*hidden*";
        var mediaStats = "https://api.wistia.com/v1/stats/medias/" + hashedId + ".json?api_password=" + wistiaKey;

        $.getJSON(mediaStats, function (data) {
            var loads = data.load_count;
            var plays = data.play_count;
            var engagement = data.engagement;

            $('#insert-json-videos').append('<div class="col-lg-12 spacer"><div class="video"><img id="video-thumb" src="' + thumb + '"><div class="video-menu"><div class="video-desc"><div class="video-main">' + name + '</div><div class="video-sub"><span id="video-desc">' + description + '</span></div></div><div class="video-stats"><div class="video-main"><a href="stats"><span id="video-views">' + plays + '</span></a></div><div class="video-sub">total views</div></div></div></div></div>');


        });


    })
});

【讨论】：