当前位置：首页 > 资讯 > 技术文档

Jquery getJSON方法详细分析

时间：2022-07-30 11:25 编辑：来源：阅读：
扫一扫，手机访问

摘要：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）

[u]复制代码[/u] 代码如下:

Customer customer = new Customer
      { Unid=1,CustomerName="宋江",Memo="天魁星",Other="黑三郎"};
string strJson = Newtonsoft.Json.JsonConvert.SerializeObject(customer);
context.Response.Write(strJson);

[b]（一）Jquery. getJSON[/b] 方法定义：jQuery.getJSON( url, data, callback ) [b]通过get请求得到json数据 [/b]·url用于提供json数据的地址页 ·data(Optional)用于传送到服务器的键值对 ·callback(Optional)回调函数，json数据请求成功后的处理函数

[u]复制代码[/u] 代码如下:

function(data, textStatus) {
        // data是一个json对象
        // textStatus will be "success"
       this; // the options for this ajax request
}

[b]（1）一个对象 [/b]

[u]复制代码[/u] 代码如下:

$.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循环来打印这条宋江的记录：

[u]复制代码[/u] 代码如下:

$.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：黑三郎 [b]（2）对象数组 [/b]Ashx文件（Json_1.ashx）修改：

[u]复制代码[/u] 代码如下:

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开始的索引。

[u]复制代码[/u] 代码如下:

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

这时，k值为0,1…… 列表json对象的方法：

[u]复制代码[/u] 代码如下:

$.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对。

全部评论(0)

上一篇：Jquery操作radio的简单实例
下一篇：jquery实现很酷的网页顶部图标下拉菜单效果

资讯排行榜
更多>>