Question

我有以下情况。

我有以下方法来进行ajax调用以加载json数据。

// Generic loadJSON
function loadJSON(method, url, callback)
{
    $.ajax({
        type: method,
        url: url,
        jsonpCallback: 'jsonCallback',
        contentType: "application/json",
        dataType: 'jsonp',
        success: function (json) {
            callback(json);
        },
        error: function(e) {
            console.log(e);
        }
    });
}

我有以下功能设置来加载json数据

    loadJSON('GET', 'url/Scripts/data.json?callback=?', function (response)
{
    jsonData = response;
    var returnHighest = getHighestValue("Return");
    var riskHighest = getHighestValue("Risk");
    var returnLowest = getLowestValue("Return");
    var riskLowest = getLowestValue("Risk");
    gauge.max = returnHighest / 100;
    gauge.min = returnLowest / 100;
    gauge2.max = riskHighest / 100;
    gauge2.min = riskLowest / 100;
    //gaugeInput.max = returnHighest / 100;
    // gaugeInput.min = returnLowest / 100;
    // gauge2Input.max = riskHighest / 100;
    //gauge2Input.min = riskLowest / 100;
    loadJSON('GET', 'url/Scripts/data2.json?callback=?', function (response)
    {
        jsonData2 = response;
        CalculateRiskReturnCorrelation();
        gauge.value = GetReturn() / 100;
        $('#returnValue').html("" + (gauge.value*100).toFixed(2) + "%");
        gauge2.value = GetRisk() / 100;
        $('#riskValue').html("" + (gauge2.value * 100).toFixed(2) + "%");
        CalculateRiskReturnCorrelation();
    });

    // Loads JSON to change the alternative fund data
    loadJSON('GET', 'url/Scripts/data3.json?callback=?', function (response) {
        jsonData3 = response;
        // Set gloabl vairables
        alternativeColor = jsonData3.Fund1.Color;
        alternativeName = jsonData3.Fund1.Name;
        alternativeMax = jsonData3.Fund1.Max;
        // Handle possible height change of label
        $('#alternatives-text').html(alternativeName);
        var newTopPos = (($('#alternatives-text').height() - $('#slider_alternatives').height()) / 2) + $('#alternatives-text').position().top;
        $('#alternatives-text').css({ top: newTopPos + "px" });
        $('#slider_alternatives').css({ background: alternativeColor });
        $('#slider_alternatives').slider('option', { min: 0, max: alternativeMax });
        var chart = $('#pie').highcharts();
        chart.series[0].addPoint({ name: alternativeName, y: 0, color: alternativeColor, style: { fontSize: "15px", "text-align": "right" } });
        alternativesSet = true;

    });
});

现在有时这会正确加载，有时第三个JSON调用会加载第二个json调用的数据。不确定这是如何可能的，因为它们有不同的URL并且它们的响应函数完全不同并且是自包含的。第二个json调用会立即获得成功消息和错误。

这似乎是一个时间问题，因为它有时会起作用，但我不知道答案是如何被克服的。任何帮助或建议表示赞赏

Answer 1

我认为在时间方面，一个电话会在另一个电话之前返回。在此方案中，您需要等待每个人返回，然后再开始下一个。尝试将ajax调用设置为＆＃39; async：false＆＃39;像这样：

// Generic loadJSON
function loadJSON(method, url, callback)
{
  $.ajax({
    type: method,
    url: url,
    jsonpCallback: 'jsonCallback',
    contentType: "application/json",
    dataType: 'jsonp',
    async: false,
    success: function (json) {
        callback(json);
    },
    error: function(e) {
        console.log(e);
    }
  });
}

连续的Ajax调用有数据交换

1 个答案: