欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Jquery getJSON方法详细分析

程序员文章站 2022-09-26 20:11:07
准备工作 ·Customer类 . 代码如下: public class Customer {     public in...

准备工作
·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) {
       $("#pmessage").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/>";
        })
        $("#pmessage").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/>";
            });
        });
        $("#pmessage").html(tt);
});


结果:
Unid:1
CustomerName:宋江
Memo:天魁星
Other:黑三郎
Unid:2
CustomerName:吴用
Memo:天机星
Other:智多星
 

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