zoukankan      html  css  js  c++  java
  • jQuery getJSON()方法学习

    jQuery.getJSON(url,[data],[callback]),通过 HTTP GET 请求载入 JSON 数据。
    参数:
          url (String) : 发送请求地址。
          data (Map) : (可选)待发送 Key/value 参数。
          callback (Function) : (可选)载入成功时回调函数。

    例子:

    test.htm

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        <title></title>
        <script type="text/javascript" src="jquery-1.4.2.min.js"></script>
        <script type="text/javascript">
        function getData(){
           $("#list").html("");
           $.getJSON("Handler1.ashx",
                   {name:"test",age:20},
                    function(data){
                   $.each(data, function(i) {
                   $("#list").append("<li>姓名:" + data[i].name + "&nbsp;性别:" + data[i].sex + "&nbsp; 年龄:" + data[i].age + "</li>")
                          })
                    })
         }
        </script>
    </head>
    <body>
    <input id="Button1" type="button" value="获取数据" onclick="getData()" />
       <ul id="list"></ul>
    </body>
    </html>

    Handler1.ashx

     public void ProcessRequest(HttpContext context)
            {
                context.Response.ContentType = "text/plain";

                //string name = context.Request.QueryString["name"];
                DataTable dt = CreateDataSource();
                StringBuilder data = new StringBuilder();
                data.Append(DataTableToJSON(dt, true));
                context.Response.Write(data);
            }
            public bool IsReusable
            {
                get
                {
                    return false;
                }
            }
            /// <summary>
            /// 生成测试数据
            /// </summary>
            /// <returns></returns>
            public System.Data.DataTable CreateDataSource()
            {
                System.Data.DataTable dt = new System.Data.DataTable();
                System.Data.DataRow dr;
                dt.Columns.Add(new System.Data.DataColumn("name", typeof(System.String)));
                dt.Columns.Add(new System.Data.DataColumn("sex", typeof(System.String)));
                dt.Columns.Add(new System.Data.DataColumn("age", typeof(System.Int32)));
              
                for (int i = 0; i < 8; i++)
                {
                    Random rd = new Random(Environment.TickCount * i);
                    int r = rd.Next(1, 20);
                    dr = dt.NewRow();
                    dr[0] = "无名氏" + i.ToString();
                    if (r < 11)
                        dr[1] = "男";
                    else
                        dr[1] = "女";
                    dr[2] = r;  
                    dt.Rows.Add(dr);
                }          
                return dt;
            }

    其中DataTableToJSON()方法为DataTable解析成JSON,见另一篇文章DataTable解析成JSON方法说明

    页面点击“获取数据”的某次结果如下:

        * 姓名:无名氏0 性别:女  年龄:14
        * 姓名:无名氏1 性别:男  年龄:9
        * 姓名:无名氏2 性别:男  年龄:4
        * 姓名:无名氏3 性别:女  年龄:18
        * 姓名:无名氏4 性别:女  年龄:12
        * 姓名:无名氏5 性别:男  年龄:7
        * 姓名:无名氏6 性别:男  年龄:2
        * 姓名:无名氏7 性别:女  年龄:16

  • 相关阅读:
    AGC002
    ICPC 北美Mid Central 2019 Regional
    【洛谷 5020】货币系统
    【洛谷 1109】学生分组
    【洛谷 2915】奶牛混合起来
    【洛谷 4162】最长距离
    【YCOJ 3805】竞选
    【洛谷 2807】最长路
    【洛谷 2918】买干草Buying Hay
    【LOJ 10172】涂抹果酱
  • 原文地址:https://www.cnblogs.com/gdjlc/p/2086900.html
Copyright © 2011-2022 走看看