Jquery 如何使Ajax GET请求的变量检索JSON数据？

我读了一些关于“异步ajax json调用”的书，还观看了youtube上的一些教程。之后，我编写了下面的代码，在名为

fieldList

的全局变量中返回getJSON调用的响应。但是我的

var字段列表中的对象保持为空。我认为这是因为在填写
var fieldList
之后，异步调用完成了。但我现在不知道如何解决这个问题。有人能帮我写代码吗

My.js文件：

  var fieldList = $("div.slctField");  

    $("#slctTable").change(function()
    {
        $.getJSON("dropdown_code/get_fields.php?table=" + $(this).val(), success = function(data)
        {
            var options = "";
        for(var i = 0; i < data.length; i++)
            {
                options += "<option value='" + data[i] + "'>" + data[i] + "</option>";
            }
        $("#slctField").html("");
        $("#slctField").append(options);
        $("#slctField").change();
    });    
    });

console.log(fieldList);

我把它放回了控制台：


所以它仍然是空的，但我不知道为什么？
考虑一下您编写的代码

在
$（“#slctTable”）.change（）上执行
$.getJSON

$.getJSON
是一个异步函数，这意味着发送ajax请求，并且只有在ajax成功完成后才会执行您指定的
success
回调函数

    var fieldList = $("div.slctField");  

    $("#slctTable").change(function()
    {
        $.getJSON("dropdown_code/get_fields.php?table=" + $(this).val(), success = function(data)
        {
            var options = "";
        for(var i = 0; i < data.length; i++)
            {
                options += "<option value='" + data[i] + "'>" + data[i] + "</option>";
            }
        $("#slctField").html("");
        $("#slctField").append(options);
        $("#slctField").change();
    });    
    });

console.log(fieldList);

编辑：
考虑下面的演示。

我使用了一个
ajax
请求从维基百科加载一些结果，并将其作为选项放在您的下拉列表中。不用担心URL

单击
getOptions
按钮。比较成功回调外部的
console.log
1与成功回调内部和结束时的
console.log
2的对比度值


$（文档）.ready（函数（）{
变量字段列表=$（“#slctField”）；
$（“#选择按钮”）。单击（函数（）{
var query_url=”https://en.wikipedia.org/w/api.php?format=json&action=query&generator=search&gsrnamespace=0&gsrlimit=10&prop=pageimages|摘录和偷盗=最大值&退出和解释文本&退出句子=1&退出限制=最大值”；
var search_txt=“ball”；
query_url+=”&gsrsearch=“+search_txt；
查询url+=“&回调=？”
$.getJSON（查询url，函数（json）{
var期权=”；
var data=json[“查询”][“页面”]；
//控制台日志（数据）；
$。每个（数据、功能（i、v）{
//console.log（“console.log结果：+data[“extract”]）；
选项+=“”+v[“提取”]+“”；
});
$（“#slctField”）.html（“”）；
$（“#slctField”）。附加（选项）；
console.log（“console.log 1:Fieldlist”+Fieldlist.children（）.first（）.val（））；
});
});
log（“console.log 2:Fieldlist”+Fieldlist.children（）.first（）.val（））；
});
考虑一下您编写的代码

在
$（“#slctTable”）.change（）上执行
$.getJSON

$.getJSON
是一个异步函数，这意味着发送ajax请求，并且只有在ajax成功完成后才会执行您指定的
success
回调函数

    var fieldList = $("div.slctField");  

    $("#slctTable").change(function()
    {
        $.getJSON("dropdown_code/get_fields.php?table=" + $(this).val(), success = function(data)
        {
            var options = "";
        for(var i = 0; i < data.length; i++)
            {
                options += "<option value='" + data[i] + "'>" + data[i] + "</option>";
            }
        $("#slctField").html("");
        $("#slctField").append(options);
        $("#slctField").change();
    });    
    });

console.log(fieldList);

编辑：
考虑下面的演示。

我使用了一个
ajax
请求从维基百科加载一些结果，并将其作为选项放在您的下拉列表中。不用担心URL

单击
getOptions
按钮。比较成功回调外部的
console.log
1与成功回调内部和结束时的
console.log
2的对比度值


$（文档）.ready（函数（）{
变量字段列表=$（“#slctField”）；
$（“#选择按钮”）。单击（函数（）{
var query_url=”https://en.wikipedia.org/w/api.php?format=json&action=query&generator=search&gsrnamespace=0&gsrlimit=10&prop=pageimages|摘录和偷盗=最大值&退出和解释文本&退出句子=1&退出限制=最大值”；
var search_txt=“ball”；
query_url+=”&gsrsearch=“+search_txt；
查询url+=“&回调=？”
$.getJSON（查询url，函数（json）{
var期权=”；
var data=json[“查询”][“页面”]；
//控制台日志（数据）；
$。每个（数据、功能（i、v）{
//console.log（“console.log结果：+data[“extract”]）；
选项+=“”+v[“提取”]+“”；
});
$（“#slctField”）.html（“”）；
$（“#slctField”）。附加（选项）；
console.log（“console.log 1:Fieldlist”+Fieldlist.children（）.first（）.val（））；
});
});
log（“console.log 2:Fieldlist”+Fieldlist.children（）.first（）.val（））；
});

put
fieldList=$（“div.slctField”）getJSON
末尾的code>可能会有所帮助紧跟在
$（“#slctField”）.change（）之后但我的全局'var$fieldList'中仍然没有任何对象。可能是Yeah Juhana的副本，我在那个问题上读过。但我还是不明白我做错了什么？是的。因为如果有人能告诉我我的代码出了什么问题，我就能理解我做错了什么getJSON
末尾的code>可能会有所帮助紧跟在
$（“#slctField”）.change（）之后但我的全局'var$fieldList'中仍然没有任何对象。可能是Yeah Juhana的副本，我在那个问题上读过。但我还是不明白我做错了什么？是的。因为如果有人能告诉我我的代码出了什么问题，我就能理解我做错了什么。哦，现在我明白了！非常感谢你提供的信息。但是当我检查
console.log（fieldList）
时，它仍然有0个对象。@L.Grunn第一个还是第二个？第二个。它有0个对象。如果是这样，则必须查看html。检查
“div.slctField”
中是否有任何内容，谢谢，我会这样做的。噢，现在我明白了！非常感谢你提供的信息。但是当我检查
console.log（fieldList）
时，它仍然有0个对象。@L.Grunn第一个还是第二个？第二个。它有0个对象。如果是这样，则必须查看html。检查
div.slctField“
谢谢
    var fieldList = $("div.slctField");  

    $("#slctTable").change(function()
    {
        $.getJSON("dropdown_code/get_fields.php?table=" + $(this).val(), success = function(data)
        {
            var options = "";
        for(var i = 0; i < data.length; i++)
            {
                options += "<option value='" + data[i] + "'>" + data[i] + "</option>";
            }
        $("#slctField").html("");
        $("#slctField").append(options);
        $("#slctField").change();
        console.log(fieldList);
    });    
    });