Jqueryの詳細な分析 getJSON Method_jquery

準備
・顧客クラス

コードをコピー コードは次のとおりです。

public class Customer
{
public int { set; }
public string Memo { get; { get ; set }
}


・サーバー側処理 (Json_1.ashx)

コードは次のとおりです: 顧客 customer = 新しい顧客

{ Unid=1,CustomerName="Song Jiang",Memo="Tiankuixing",Other="Blackサブロー"};

string strJson = Newtonsoft.Json.JsonConvert.SerializeObject(customer);

context.Response.Write(strJson);

(1) Jquery.getJSON

メソッド定義: jQuery.getJSON( url, data, callback )

get リクエストを通じて json データを取得します

・url は、json データのアドレス ページを提供するために使用されます
・data (オプション) は、キーと値のペアの送信に使用されますサーバーへ・callback (オプション) コールバック関数、JSON データリクエストが成功した後の処理関数

コードをコピー コードは次のとおりです。function(data, textStatus) {

// データは json オブジェクトです

// textStatus は "success" になります
これ; // この ajax リクエストのオプション
}

(1) オブジェクト

コードをコピーします コードは次のとおりです:$.getJSON(

"webdata/Json_1.ashx",

function( data) {
$("#divmessage") .text(data.CustomerName);
}
);


Json_1.ashx アドレスから json データをリクエストします。データを受信し、関数内でデータを処理します。 ここでのデータは顧客インスタンスに対応するレコードであり、その中のデータは k/v 形式で存在します。つまり、[オブジェクト, オブジェクト]配列の形で存在します。
{"Unid":1,"CustomerName":"Song Jiang","Memo":"Tian Kuixing","Other":"Black Saburo"}

アクセスするときは、data.Property を使用してアクセスし、k/v ループを使用して Song Jiang のレコードを出力します:

コードをコピー コードは次のとおりです。$.getJSON(

"webdata/Json_1.ashx",

function(data) {
var tt="" ;
html(tt);
});


結果:
単位: 1
顧客名: Song Jiang
メモ:
その他:黒サブロウ

(2) オブジェクト配列

Ashx ファイル (Json_1.ashx) 変更:

コードをコピー

コードは次のとおりです: List _list = new List(); Customer customer = new Customer { Unid =1, CustomerName="Song Jiang",Memo="Tian Kuixing",Other="Hei Sanlang"};顧客 customer2 = 新規顧客

{ Unid = 2, CustomerName = "Wu Yong", Memo = "Tianji Xing" , Other = "智多星" };

_list.Add(customer);
_list.Add(customer2);
string strJson = Newtonsoft.Json.JsonConvert.SerializeObject(_list);
生成される json オブジェクトの文字列は次のとおりです:

[{"Unid":1,"CustomerName":"Song Jiang","Memo":"Tiankuixing","Other":"Herosuburo"},
{"Unid":2,"CustomerName " :"呉勇","メモ":"天吉興","その他":"知多興"}]

ここでは、コレクションとしての json オブジェクトが 1 つのレコードではなく、[[オブジェクト, オブジェクト]]: [オブジェクト, オブジェクト] [オブジェクト, オブジェクト] とそれぞれの [ の配列であることがわかります。 object, object] は Customer に対応するレコードを表します。これは実際には k/v の形式であり、この v は Customer オブジェクトであり、この k は 0 から始まるインデックスです。

コードをコピー コードは次のとおりです。

$.getJSON(
"webdata /Json_1.ashx",
function(data) {
$.each(data, function(k, v) {
alert(k);
});
});

このときの k 値は 0,1...

JSON オブジェクトをリストするメソッド:

コードをコピー コードは次のとおりです:

$.getJSON (
"webdata/Json_1.ashx",
function(data) {
var tt = "";
$.each(data, function(k, v) {
$. each(v,function(kk, vv) {
tt = kk "：" vv "
";
").html(tt);
});


結果:

単位: 1
顧客名: Song Jiang
メモ: Tiankuixing
その他: Black Sanlang
単位: 2
顧客名: 呉勇
メモ: 天吉星
その他: 志都興


ここではネストされたループが使用されます。最初のループは List から Customer オブジェクトを走査するために使用され、2 番目のループは Customer オブジェクトから Customer オブジェクトの属性、つまり k/v ペアを走査するために使用されます。 。