为什么我不能立即使用 $.getJSON() 的结果？答案

【问题标题】：Why can't I use the result of $.getJSON() immediately?为什么我不能立即使用 $.getJSON() 的结果？
【发布时间】：2012-03-08 11:37:08
【问题描述】：

我试图让我的 $.getJSON 工作，但它什么也没返回。这是我的 jQuery：

$('#courseSelect').bind('change', function()
{
    data = $.getJSON('lessons.js');
    var html ='<select name="lessonSelect id="lessonSelect">';
    var len = data.length;
    alert(data.length); //this alerts "undefined"
    for (var i = 0; i< len; i++) {
        html += '<option value="' + data[i].value + '">' + data[i].name + '</option>';
    }
    html +='</select>';
    alert(html); //this alerts <select...></select> 
    //but no option tags because there's nothing to loop through
    $('lessonsDiv').html(html);
});

这是我的课程.js 文件

   {"lessons": 
     [
          {"value": "1", "name": "Lesson 1"},
          {"value": "2", "name": "Lesson 2"},
          {"value": "3", "name": "Three"}
     ]
    }

最终，我要做的是在首先选择课程时创建一个新的课程选择列表。但是现在，我只是想让这个 getJSON 方法工作，但事实并非如此。如果有人能看出问题所在，那就太好了。它期待不同类型的数据吗？

【问题讨论】：

标签： jquery json getjson

【解决方案1】：

对getJSON() 的调用是异步的；结果无法立即获得。从getJSON() 返回的是jqXHR 对象，它正在监视异步请求的状态。

您需要注册一个回调（这是第二个参数的用途），它在响应可用后执行。处理异步请求的jqXHR 对象将在请求成功完成后自动执行您的回调。

$('#courseSelect').bind('change', function() {
    $.getJSON('lessons.js', function(data) {
        var html = '<select name="lessonSelect id="lessonSelect">';
        var len = data.length;
        alert(data.length); //this alerts "undefined"
        for (var i = 0; i < len; i++) {
            html += '<option value="' + data[i].value + '">' + data[i].name + '</option>';
        }
        html += '</select>';
        alert(html); //this alerts <select...></select> 
        //but no option tags because there's nothing to loop through
        $('lessonsDiv').html(html);
    });
});

完成此操作后，data 将是一个对象，例如；

var data = {"lessons": 
 [
      {"value": "1", "name": "Lesson 1"},
      {"value": "2", "name": "Lesson 2"},
      {"value": "3", "name": "Three"}
 ]
};

因此，您实际上需要使用 data.lessons 来访问您拥有的数组（并使用 data.lessons.length 来检索它的长度）。

【讨论】：

在您的匿名函数中传递data 对象？ :/ 或者我只是被智障了。
@f0x 不一定要传递 data 如果未定义第二个参数被视为回调
@3nigma: f0x 正在纠正我在回调中遗漏了data 参数，而不是data 您可以选择传递给getJSON
这就是我之前所做的，这最终是我想要实现的目标，但我试图确保 $.getJSON() 实际上首先返回一些东西（逐步进行）但是它没有.. 无论如何，我恢复到你在这里所做的事情，这是我之前所做的事情，但它仍然提醒 undefined
@user1219572：查看我的更新。您应该使用data.lessons 而不是data 来访问数组（但您仍然需要在回调中完成所有这些操作）。

【解决方案2】：

您的以下代码：

data = $.getJSON('lessons.js')

不起作用。 AJAX 不是同步的。它是，as its name says，异步。这意味着你不要等到答案回来。您指定一个回调函数来处理接收到的数据。

例如：

$.getJSON('lessons.js', handleDatas)
// This function will be executed when the datas come back
function handleDatas(data) {
    // use the `data` variable here
}

虽然它通常是这样使用的：

$.getJSON('lessons.js', function(data) {
    // use the `data` variable here
}

在那里，我们使用一个匿名函数作为回调。

有关更多信息，请查看jQuery documentation 上的示例。

【讨论】：