从 jQuery 中的延迟调用中获取 JSON 数据

Question

我觉得我错过了一些完全简单的东西。请帮忙！我第一次使用这部分 jQuery....

这是我的代码。如何遍历do_it 返回的每个元素？

function do_it(a){
  return $.getJSON('url', {mode: 'get_array', id: a}); // returns JSON object
};

$.when.apply(do_it[1,2,3]).then (function(data){
  // how to get each element returned by do_it() here?
}, function () {console.log('Failed');<br>});

Answer 1

在此示例中，我已修复数据中的所有错误并使用 deferred 对象来复制程序的功能。

Fiddle.

data 是一个包含多个对象的数组。代码循环遍历数组对象并从每个对象中挑选出值以添加到表中。请注意，我倾向于使用 array.join() 而不是字符串连接来构建 HTML - YMMV。

$.when(do_it()).then(function (data) {
    var html = [];
    html.push('<table>');
    for (var i = 0, l = data.length; i < l; i++) {
      var row = [];
      row.push('<tr>');
      row.push('<td>' + data[i].ID + '</td>');
      row.push('<td>' + data[i].L_Name + '</td>');
      row.push('<td>' + data[i].F_Name + '</td>');
      row.push('<td>' + data[i].Email + '</td>');
      row.push('<td>' + data[i].Department + '</td>');
      row.push('</tr>');
      html.push(row.join(''));
    }
    html.push('</table>');
});

希望对你有用。

Answer 2

$.getJSON 返回一个承诺对象：http://api.jquery.com/jquery.getjson/
这样，您可以附加 done、fail 和 always 函数以分别运行。使用它，您可以将代码格式化为。

function do_it (id) {
    return $.getJSON(url, {
        mode: 'get_array',
        id: id
    });
}

do_it([1, 2, 3]).done(function (data) {
    for (var key in data) {
        console.log(key, " = ", data[key]);
    }
}).fail(function () {
    console.log("Failed");
});

我不确定您打算将什么传递给do_it，如果它是数组或单独的每个id，如果是后者，您可以这样做：

$.each([1, 2, 3], function (id) {
   do_it(id) // same stuff as above

编辑：根据您的 cmets，这里有一个建议，虽然不是表现最好的建议。

var data = [];

$.when.apply($.map([1,2,3], function (id) {
    return do_it(id).done(function (d) {
        data.push(d[0]);
    });
}).done(function () {
    for (var d in data) {
        console.log(d);
    }
}).fail(function() {
    console.log("Failed");
});

Answer 3

假设返回值是一个数组：

$.when.apply(do_it[1,2,3]).then(function(data){
   $(JSON.parse.(data)).each(function(index, element){
   //do stuff
   });
}, function () {console.log('Failed');<br>}); 

编辑：

根据您的 cmets，我们假设：

var data = '[{"ID":1,"L_Name":"Jones","F_Name":"Jan","Email":"jjones@email.com","Telephone_No‌​":"xxx.xxx.xxxx","Institution":"IT","Department":"3","Notes":"","Secretary":0},{"I‌​D":3,"L_Name":"Smith","F_Name":"Christopher","Email":"email@gmail.com","Telephone‌​_No":"","Institution":"IT","Department":"18","Notes":"","Secretary":0},{"ID":4,"L_‌​Name":"White","F_Name":"Amanda","Email":"white@email.com","Telephone_No":"","Inst‌​itution":"UT","Department":"25","Notes":"","Secretary":0}]';

请注意，我添加了数组 [ ... ] 的左括号和右括号以及元素之间的逗号。

然后循环遍历你可以做的数组：

var json = JSON.parse(data);
$(json).each(function(index,element){
    //do stuff
    alert("index: " + index + " element: " + element );
});