Jquery getJSON方法详细分析

  准备工作

  ·Customer类

  

复制代码 代码如下:

  public class Customer

  {

  public int Unid { get; set; }

  public string CustomerName { get; set; }

  public string Memo { get; set; }

  public string Other { get; set; }

  }

  ·服务端处理(Json_1.ashx)

  

复制代码 代码如下:

  Customer customer = new Customer

  { Unid=1,CustomerName="宋江",Memo="天魁星",Other="黑三郎"};

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

  context.Response.Write(strJson);

  (一)Jquery. getJSON

  方法定义:jQuery.getJSON( url, data, callback )

  通过get请求得到json数据

  ·url用于提供json数据的地址页

  ·data(Optional)用于传送到服务器的键值对

  ·callback(Optional)回调函数,json数据请求成功后的处理函数

  

复制代码 代码如下:

  function(data, textStatus) {

  // data是一个json对象

  // textStatus will be "success"

  this; // the options for this ajax request

  }

  (1)一个对象

  

复制代码 代码如下:

  $.getJSON(

  "webdata/Json_1.ashx",

  function(data) {

  $("#divmessage").text(data.CustomerName);

  }

  );

  向Json_1.ashx地址请求json数据,接收到数据后,在function中处理data数据。 这里的data的数据是一条记录,对应于一个customer实例,其中的数据以k/v形式存在。即以[object,object]数组形式存在。

  {"Unid":1,"CustomerName":"宋江","Memo":"天魁星","Other":"黑三郎"}

  所以在访问时,以data.Property来访问,下面以k/v循环来打印这条宋江的记录:

  

复制代码 代码如下:

  $.getJSON(

  "webdata/Json_1.ashx",

  function(data) {

  var tt="";

  $.each(data, function(k, v) {

  tt += k + ":" + v + "<br/>";

  })

  $("#divmessage").html(tt);

  });

  结果:

  Unid:1

  CustomerName:宋江

  Memo:天魁星

  Other:黑三郎

  (2)对象数组

  Ashx文件(Json_1.ashx)修改:

  

复制代码 代码如下:

  List<Customer> _list = new List<Customer>();

  Customer customer = new Customer

  { Unid=1,CustomerName="宋江",Memo="天魁星",Other="黑三郎"};

  Customer customer2 = new Customer

  { Unid = 2, CustomerName = "吴用", Memo = "天机星", Other = "智多星" };

  _list.Add(customer);

  _list.Add(customer2);

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

  它生成的json对象的字符串是:

  [{"Unid":1,"CustomerName":"宋江","Memo":"天魁星","Other":"黑三郎"},

  {"Unid":2,"CustomerName":"吴用","Memo":"天机星","Other":"智多星"}]

  这里可以看到做为集合的json对象不是再一条记录,而是2条记录,是一个[[object,object]]数组:[object,object][object,object],而每个[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 + "<br/>";

  });

  });

  $("#divmessage").html(tt);

  });

  结果:

  Unid:1

  CustomerName:宋江

  Memo:天魁星

  Other:黑三郎

  Unid:2

  CustomerName:吴用

  Memo:天机星

  Other:智多星

  

  这里用了嵌套循环,第一个循环用于从List中遍历Customer对象,第二个循环用于从Customer对象中遍历Customer对象的属性,也就是k/v对。