等待jquery中getJSON完成的回调答案

【问题标题】：wait for callback of getJSON finish in jquery等待jquery中getJSON完成的回调
【发布时间】：2012-08-21 01:06:57
【问题描述】：

我有这样的事情：

<div id="content"></div>

和 JS：

function getData(id) {
    $.getJSON('url/to/jsondata',{id: id}, function(data) {
         /** append some data to div#content  **/
         $('#content').data('key', 'value');
     });

然后我想在脚本中获取#content的数据：

$(document).ready(function() {
    getData(1); // run getData with some id
    console.log($('#content').data('key'));
});

问题是在 getJSON 回调完成后 console.log 没有运行，所以我在日志中得到一个未定义的值。哪个是让它工作的正确方法？谢谢！

【问题讨论】：

@TheZ 你的评论是一个答案 - 你应该把它作为一个答案，这样它就可以被投票作为答案。

标签： javascript jquery callback getjson

【解决方案1】：

从 ajax 函数返回延迟对象，并对其使用 always、done 或 fail 方法：

function getData(id) {
    return $.getJSON('url/to/jsondata',{id: id}, function(data) { //return this
         $('#content').data('key', data);
     });
}

$(document).ready(function() {
    getData('content').always(function() { //is returned as deffered object
        console.log($('#content').data('key')); //runs when ajax completed
    });
});

【讨论】：

【解决方案2】：

您已经在getJSON 调用中定义了回调。要获得结果，请将您的 console.log 代码放在与 /** append some data to div#content **/ 注释相同的函数中。

这里是 getJSON 的 jQuery 文档，因此您可以查看哪个是正确的参数以及如何布置它：http://api.jquery.com/jQuery.getJSON/

【讨论】：

对不起，没有看到你的答案，我 +1 =)
@Mario 不用担心，你有示例代码，当所有其他方法都失败时，它总是有帮助！
@TheZ+Mario: console.log 只是为了检查我得到了哪个值。我想像这样使用 $('#content').data('key') 循环：while($('#content').data('key') < someValue) { var id = newID; getData(id); }

【解决方案3】：

你应该像这样将日志调用放在回调函数中：

function getData(id) {
    $.getJSON('url/to/jsondata',{id: id}, function(data) {
         /** append some data to div#content  **/
         $('#content').data('key', 'value');

         console.log($('#content').data('key'));
     });

【讨论】：