• AJAX请求 $.getJson方法的使用


    使用jQuery的$.getJson方法可以异步的获取服务器端返回的json字符串。

    $.getJson方法语法

    $.getJson(url,parameters,callback)

    参数

     

    url

    (字符串)将要通过GET方法进行交互的服务器端资源的url。

    parameters

    (对象)一个对象,其属性作为“键/值”用于构造查询字符串并追加到url;或者一个预格式化和uri编码的查询字符串。

    callback

    (函数)回调函数,在请求完成时被调用。把响应体解析为json字符串,这个字符串的值作为第一个参数传递到这个回调函数,响应状态作为第二个参数传递到该函数。

    返回值

    XHR实例

    下面看个例子

    客户端代码:

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title></title>
    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    $().ready(function () {
      $('#clk').click(function () {
        var num = $(this).val();
        $.getJSON('Server.aspx', callback)
      })
      function callback(json, status) {
        $.each(json, function (i) {
          $('#show').append('name:' + json[i]['Name'] + 'age:' + json[i]['Age'] + '<br/>');
        })
      }
    })
    </script>
    </head>
    <body>
    <input id="clk" type="button" value="button" />
    <div id="show">
    </div>
    </body>
    </html>
    

    服务端主要代码:

    using System;
    using System.Collections.Generic;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.Script.Serialization;//适用于.NetFramework 3.5
    
    public partial class Server : System.Web.UI.Page
    {
      protected void Page_Load(object sender, EventArgs e)
      {
        if (!Page.IsPostBack)
        {
          //List<Person> per = new List<Person>();
          //per.Add(new Person("张三", 18));
          //per.Add(new Person("李四", 19));
          //JavaScriptSerializer jsonHelper = new JavaScriptSerializer();
          //string json = jsonHelper.Serialize(per);
          //Response.Write(json);
          Response.Write(GetJSONData());
        }
      }
      protected string GetJSONData()
      {
        string str = string.Empty;
        //特别要注意json的返回格式,如果格式不正确将不能正常调用客户端的回调函数
        str = "[{\"Name\":\"张三\",\"Age\":\"14\"}," +
        "{\"Name\":\"李四\",\"Age\":\"17\"}," +
        "{\"Name\":\"王五\",\"Age\":\"19\"}]";
        return str;
      }
    
      public class Person
      {
        private string name;
        private int age;
        public string Name
        {
          get { return name; }
          set { name = value; }
        }
        public int Age
        {
          get { return age; }
          set { age = value; }
        }
    
        public Person(string name, int age)
        {
          this.name = name;
          this.age = age;
        }
      }
    }
    
    

    运行程序,结果如图:

    clip_image002

    如果你不熟悉json格式,也不要紧。可以使用System.Web.Script.Serialization(framework 3.5)命名空间下为格式化为json的帮助类。我们可以把服务器端Page_Load事件中注释的代码变为可用。把Response.Write(GetJSONData())这句注释掉。再运行程序,结果没有问题,如下图。它把类直接格式化为json字符串,省去了很多时间。

    clip_image004

    Demo下载

  • 相关阅读:
    Pod中spec的字段常用字段及含义
    day62-无名有名分组反向解析,路由分发,视图层等
    day61-数据增删改查,orm表关系,django请求生命周期流程图
    day60-静态文件,数据库,ORM
    day59-简易版本的web框架,django框架初识
    day58-jquery后续,前端BootSrtap,图书管理系统搭建
    day57-jQuery练习与操作,各种事件
    day56-js,jquery
    day55-js
    day54-js类型与对象
  • 原文地址:https://www.cnblogs.com/Johnny_Z/p/2552603.html
Copyright © 2020-2023  润新知