在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

假設返回值是一個數組：

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

編輯：

從你的意見，讓我們假設：

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); 
}); 

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 

編輯：基於您的意見，這裏是一個建議，雖然不是最好的表現建議。

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

在這個例子中，我固定在數據的任何錯誤，並使用了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>'); 
}); 

我希望它對您有些用處。