Question

看起来我的for循环正在循环解析到所有字段的最后一个对象。

这是我正在使用的实际代码，我为codepen构建了类似的东西，因为我无法从codepen上的实际源请求JSON。

var championMasteryPHP = "https://api.myjson.com/bins/xked";

$.getJSON(championMasteryPHP, function (json) {
    for (var i = 0; i < json.length; i++) {
        var champID = json[i].championId;
        var champLevel = json[i].championLevel;
        var pointstonextlevel = json[i].championPointsUntilNextLevel;
        var championInfo = "http://example.com/champInfo.php?champid=" + champID;

        $.getJSON(championInfo, function (json2) {
            var champName = json2.name;
            var champTitle = json2.title;
            $('#champ').append("<li>ID: " + champID + " | Name: " + champName + " | Level: " + champLevel + " | Points to Next Level: " + pointstonextlevel + "</li>");
        });
    };
});

长话短说，我想要实现的目标看起来像这样。

但出于某种原因，这就是我得到的。

正确的名称，但其他变量是列表中的最后一个变量。

有更好的方法吗？我做错了什么？

感谢。

Answer 1

您正在javascript for for循环more info here

中使用异步处理

您可以修改为使用自执行功能，因此可以使用

var championMastery = "https://api.myjson.com/bins/xked";
$.getJSON(championMastery, function (json) {
for (var i = 0; i < json.length; i++) {

    (function(obj){
        var champID = obj.championId;
        var champLevel = obj.championLevel;
        var pointstonextlevel = obj.championPointsUntilNextLevel;
        var championInfo = "http://example.com/champInfo.php?champid=" + champID;

            $.getJSON(championInfo, function (json2) {
                var champName = json2.name;
                var champTitle = json2.title;
                $('#champ').append("<li>ID: "+champID+" | Name: " +champName+ " | Level: " +champLevel+ " | Points to Next Level: " +pointstonextlevel+ "</li>");
            });
    })(json[i])
};
});

Answer 2

我最近遇到的一篇非常好的文章。详细介绍Javascript Scope ans Closures。这是javascript，jquery编码必须知道的东西。对上述问题有解释的部分是在臭名昭着的循环问题

下查找主题

现在出现问题。您的代码应该看起来像

    $.getJSON(championInfo, function (json2) {
            (function(){
              var champName = json2.name;
              var champTitle = json2.title;
              $('#champ').append("<li>ID: "+champID+" | Name: " +champName+ " | Level: " +champLevel+ " | Points to Next Level: " +pointstonextlevel+ "</li>");            
            })()
            });

请注意我添加自执行功能的更改。所有功能都有相同输出的奇怪输出的问题是因为。

您的函数$.getJSON回调内部只是一个函数定义，此时不执行该函数。当你的第一个getJSON命中它的回调时你的for循环就完成了，变量中的最终值是最后一个循环，因此当你的第一个getJSON命中它的回调时，它显示的值是最后一个循环。

使其更简单。在控制台窗口中写下此内容。

function alert1(){ alert("I am one!!");}

现在通过执行

来调用/执行该函数

alert1();

你会收到一条警告，说“我是一个人！”

现在将其添加到控制台

function alert1(){ alert("I am one, But overritten!!");}

然后尝试调用它。输出将是“我是一个，但是过度紧张！”，所以函数实际上被覆盖了，这就是for循环中发生的事情。最后一个函数是可用于所有回调的函数。

为什么我的for循环冻结？

2 个答案: