AJAX如何接收J(rèn)SON數(shù)據(jù)示例介紹

更新時(shí)間：2013年08月13日 15:09:55 投稿：whsnow

如何使用AJAX返回JSON數(shù)據(jù)，就是dataType，當(dāng)你設(shè)置json后返回的json字符串傳遞到客戶端就是JSON對象了，示例如下，感興趣的朋友可以參考下

簡介
在我們了解如何使用AJAX返回JSON數(shù)據(jù)的時(shí)候要先明白下列幾點(diǎn)
1、 JSON如何來表示對象的
2、 JSON如何來表示數(shù)組的

var object = { "labId": "1", "labName": "服裝" };

通常我們使用如上的方式來表示JSON對象，那么數(shù)組呢

var array = [{ "labId": "1", "labName": "時(shí)尚" }, { "labId": "2", "labName": "服裝" }, { "labId": "3", "labName": "手表"}]

數(shù)組的話就如上面這樣來表示

AJAX如何接收J(rèn)SON數(shù)據(jù)
假設(shè)JSON數(shù)據(jù)是這樣的：

復(fù)制代碼代碼如下:

private void GetJSON()
{
sb.Append("]");
}

第一種：

復(fù)制代碼代碼如下:

$(".btn").live("click", function () {
$.post("JSON.aspx", { action: "GETJSON" },
function (data) {
//現(xiàn)在data的類型只是string，現(xiàn)在我們把它轉(zhuǎn)換成JSON對象
var json = eval("(" + data + ")");
if (typeof (json) === 'object') {
$(json).each(function (i) {
$("#wrap").append("<div style=\"width:100%; background:#f00;\">第一種</div>"+json[i].artId + " " + json[i].title + "<br/>內(nèi)容摘要：" + json[i].content);
});
}
}
);
});

第二種：

復(fù)制代碼代碼如下:

$(".btn").live("click", function () {
$.post("JSON.aspx", { action: "GETJSON" },
function (data) {
$(data).each(function (i) {
$("#wrap").append(data[i].artId + " " + data[i].title + "<br/>內(nèi)容摘要：" + data[i].content + "<br/>");
});
}, "json"
);
});

我們這里最后設(shè)置了一個(gè)參數(shù)，就是dataType，當(dāng)你設(shè)置json后返回的json字符串傳遞到客戶端就是JSON對象了
由于返回的data數(shù)據(jù)是一個(gè)數(shù)組對象，所以對其進(jìn)行遍歷然后獲取每一個(gè)對象屬性值