AJAX global vars

Question

我正在尝试这样做，它返回"未定义"：

$.ajax({
    url : 'curriculum/read_types',
    type : 'GET',
    dataType : 'JSON',
    success : function(data) {
        return data;
    }
})

但是如果我这样做：

$.ajax({
    url : 'curriculum/read_types',
    type : 'GET',
    dataType : 'JSON',
    success : function(data) {
        console.log(data);
    }
})

它在控制台上写入整个 JSON 对象，所以我知道存在数据。

如何返回此数据？

---

我想做的是下一个：

var curriculum = {
add : function() {
    html = [];
    html.push('<select name="type" required>');
    html.push('<option value="0">Grupo general...</option>');
    var types = curriculum.read_types();
    $.each(types, function(k,v) {
        html.push('<option value="'+v+'">'+v+'</option>')
    })
    html.push('</select>');
    content.show('Añadir imagen a curriculum',html.join(''));
},
read_types : function() {
    $.getJSON('curriculum/read_types', function(data) {
        return data;
    })
}
}
curriculun.add()

---

最后它管理了，但有一个 asyn：false 请求：

var curriculum = {
add : function() {
    html = [];
    html.push('<select name="type" required>');
    html.push('<option value="0">Grupo general...</option>');
    var types = curriculum.read_types();
    $.each(types, function(k,v) {
        html.push('<option value="'+v+'">'+v+'</option>')
    })

    html.push('</select>')
    content.show('Añadir imagen a curriculum',html.join(''));
},
read_types : function() {
    var a;
    $.ajax({
        url : 'curriculum/read_types',
        type : 'GET',
        async : false,
        contentType : 'JSON',
        success : function(data) {
            a = data;
        }
    })
    return a;
}
}

Answer 1

回调函数(如成功处理程序(是已注册的异步事件，一旦 AJAX 请求完成并将成功结果返回到客户端浏览器，就会触发这些事件。由于事件已注册，因此它不会阻止 AJAX 请求所在的函数运行。

为了处理数据，只需将数据交给另一个函数，如下所示：

$.ajax({
    url : 'curriculum/read_types',
    type : 'GET',
    dataType : 'JSON',
    success : function(data) {
        console.log(data):
        // process the results
        processData(data);
    }
});

function processData(data) {
    // do stuff with the data here
}

更新：

read_types : function() {
    $.getJSON('curriculum/read_types', function(data) {
        return data;
    });
}

上面的代码简直是您无法做到的。以下是对流程的松散描述：

• read_types函数是从其他某个进程调用的。

• $.getJSON 函数使用 2 个参数调用：路径和回调处理程序。

• read_types函数完成处理并到达终点。

• 接下来，当read_types方法正在完成时，getJSON 函数会向您的 URL 发出 HTTP GET 请求。
• 数据在响应中接收，并作为分配给参数"data"的参数传递给回调处理程序。
• 调用return data;时，将数据返回到匿名成功回调函数，而不是read_types。因此，return 语句本质上什么都不做。

同步请求示例：

现在，话虽如此，您可以向服务器发出同步请求，但强烈建议不要这样做，因为它会对视图产生影响。

但是，这里有一个示例，仅用于学术目的。我永远不会提倡使用这种策略，除非你真的真正知道你在做什么：

注意：除非您知道自己在做什么，否则不得在生产中使用！

function getData() {
    var myDataObj = null;
    // this will BLOCK execution of all other scripts on the page until
     // the data is received!
    $.ajax({
        url : 'curriculum/read_types',
        type : 'GET',
        dataType : 'JSON',
        success : function(data) {
            console.log(data):
            // we can assign this data to myDataObj in synchronous requests
            myDataObj = data;
        },
        async: false  /** Make a synchronous request **/
    });
    // Since we BLOCKED, this object is not null. If we used async: true 
     // (the default) then this would return null.
    return myDataObj;
}

Answer 2

如前所述，ajax 是异步的。 你可以传递 async false 来强制 JavaScript 线程等待，但这很讨厌，而且非常不像 JavaScript。我的解释是你想要的就是这样：

var myData;
$.ajax({
    url : 'curriculum/read_types',
    type : 'GET',
    async : false,
    dataType : 'JSON',
    success : function(data) {
        myData = data;
    }
})
// while this is what you want to do, myData would be undefined here
console.log(myData);

但相反，你应该继续做你在成功函数中所做的工作。

Answer 3

Ajax 是异步的，所以返回它没有任何好处。您可以改用自定义事件。在成功函数中：

$('#someelement').trigger('read_types_loaded', [data]);

然后在某处附加一个事件侦听器：

$('#someelement').bind('read_types_loaded', function(event,data){
    // Do something with data
});