Question

我有许多div元素需要使用来自许多不同json文件的文本填充。每个div都有一个唯一的id。有两个用于启动div元素更新的列表，一个唯一id列表以及相应json文件的列表：

$(document).ready(function () {

    var idlist = ['id1', 'id2', 'id3', 'id4'];
    var fnlist = ['fn1', 'fn2', 'fn3', 'fn4'];

    var info;

    for (info in idlist) {

        var file = fnlist[info]+'.json';
        var jsonData = $('#'+idlist[info]);

        $.getJSON(file, function (data) {
            var pic = [data.title, data.desc];
            jsonData.empty();

            if (pic.length) {
                var content = pic.join('<br>');
                var list = $('<p />').html(content);
                jsonData.append(list);
            }
        });
    }

});

在此示例中，四个getJSON请求被触发并异步返回，但在回调函数中，jsonData变量是错误的（for循环结束）并且通常指向列表中的最后一个id。关闭异步将解决这个问题，但这是一个坏主意并且已被弃用。

我的问题是如何将返回的回调绑定到原始div ID，以便我可以更新正确的元素。通常回调有一些用户提供或系统提供的有关正在处理的元素或窗口的信息，但在这里似乎返回到回调的唯一项是检索到的JSON对象（其中没有id信息）。我没有看到任何方法为回调提供额外的信息。

更新

建议的重复参考只有29个答案，不少于3个更新的答案。然而，它确实解决了这个问题，并且是javascript范围的百科全书。这是我更新的代码，似乎可以解决问题。我希望我已经正确地构建了这个：

$(document).ready(function () {

    var idlist = ['id1', 'id2', 'id3', 'id4'];
    var fnlist = ['fn1', 'fn2', 'fn3', 'fn4'];

    idlist.forEach(function(uniqueId, i) {
            var file = fnlist[i]+'.json';
            var jsonData = $('#'+uniqueId);

    $.getJSON(file, function (data) {
        console.log(data);
        var pic = [data.title, data.desc];
        jsonData.empty();

        if (pic.length) {
            var content = pic.join('<br>');
            var list = $('<p />').html(content);
            jsonData.append(list);
        }
    });

  });

});

.forEach是引用帖子中的一个建议，是解决范围问题的关键变化（并且摆脱了for-in问题）。

jQuery getJSON异步回调 - 保留<div> id

0 个答案: