JSON数据无法使用JavaScript

Question

我通过从不同的JSON网址中提取值来创建表。对于第一个JSONUrl（PoolsUrl），一切正常。使用来自第二个JSON Url（RoundsUrl）的数据添加相同的表并不合适。返回正确的数据，但附加在表的最后一行（见下图）。 RoundsUrl是使用PoolsUrl中的JSON值创建的。

为什么“Created Rounds”列的数据会附加在最后一行中，如下图所示？

$(document).ready(function () {
my_pools = {}   
$.getJSON(PoolsUrl,
        function (json) {
            my_pools = json;
            createdRounds = {}
            my_pools.createdRounds = {
                "CreatedRounds": "none"
            } //created this key and value to add number of rounds in the pool JSON properties.
            var tr;
            for (var i = 0; i < my_pools.length; i++) {
                tr = $('<tr/>');
                tr.append("<td>" + my_pools[i].poolId + "</td>");
                tr.append("<td>" + my_pools[i].name + "</td>");
                tr.append("<td>" + my_pools[i].totTeams + "</td>");
                my_poolIdString = my_pools[i].poolId.toString()
                RoundsUrl = url +  my_poolIdString
                $.getJSON(RoundsUrl, //output: {"1":"Round 1","2":"Round 2"}
                    function (json) {
                        my_roundsCreated = json;
                        my_roundsCount = Object.keys(my_roundsCreated).length
                        my_pools.createdRounds = my_roundsCount;
                        tr.append("<td>" + my_pools.createdRounds + "</td>")
                    })
                $('table').append(tr);
                }
            })
});

PoolsUrl和RoundsUrl本身被遗漏在这里但这些工作正常。返回JSON值。

问题可能是第二个$ .getJSON函数中的变量'my_pools.createdRounds'没有引用我的全局my_pools对象。

输出表格图片：

Answer 1

问题在于您有异步调用。变量var tr = $('<tr/>'); 是共享的，当调用返回时，tr是一个不同的元素。

在for循环中移动tr声明。

{{1}}

Answer 2

我在这里找到答案：www.stackoverflow.com/a/15585054/4544184

使用$ .ajax禁用异步。