JSON一些简单应用

本文介绍了一种使用JSON进行前后台数据交换的方法。通过创建一个处理文件JSONHandler.ashx来生成JSON字符串,然后利用jQuery的ajax方法及getJSON方法在前端解析并展示这些数据。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

上一节我们简单的介绍了一些JSON的基础,这一节我们来看一个JSON的简单应用,所写的内容都是从一些前辈那里copy过来的,只是希望给像我这样的新手提供给一点帮助哦!大虾们就不用看了哦……哈哈!开始吧……

我们将做一个从前台利用ajax调用一个后台方法,该方法返回的是一个JSON类型的字符串,然后我们在前台对该字符串进行处理,这里我们利用jquery提供的ajax方法,同样jquery中也提供了一个获取从后台返回的json字符串的方法,废话不多说,我们来看吧!

示例:

首先,我们建立一个JsonHelper.cs类,该类提供了两个方法,对于JSON的序列化和反序列化,类代码如下:

public class JsonHelper
       {
              /// <summary>
              /// 序列化
              /// </summary>
              public static String Serialize<T>(T data)
              {
                      System.Runtime.Serialization.Json.DataContractJsonSerializer serializer =
                      new System.Runtime.Serialization.Json.DataContractJsonSerializer(data.GetType());
                      using (MemoryStream ms = new MemoryStream())
                      {
                               serializer.WriteObject(ms, data);
                               return Encoding.UTF8.GetString(ms.ToArray());
                       }
               }

         /// <summary>
               /// 反序列化
               /// </summary>
               public static T Deserialize<T>(String jsonStr)
               {
                       T obj = Activator.CreateInstance<T>();
                       using (MemoryStream ms = new MemoryStream(Encoding.UTF8.GetBytes(jsonStr)))
                       {
                               System.Runtime.Serialization.Json.DataContractJsonSerializer serializer =
                               new System.Runtime.Serialization.Json.DataContractJsonSerializer(obj.GetType());
                               return (T)serializer.ReadObject(ms);
                        }
                }
      }

我们再建一个提供前台调用的方法类,这里我利用一个一般处理文件,新建一个一般处理文件,命名为:JSONHandler.ashx,代码如下:

 /// <summary>
       /// $codebehindclassname$ 的摘要说明
       /// </summary>
       [WebService(Namespace = "
http://tempuri.org/")]
       [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
       public class JSONHandler : IHttpHandler
       {
                public void ProcessRequest(HttpContext context)
                {
                        context.Response.ContentType = "text/plain";
                        List<User> users = new List<User>();
                        users.Add(new User
                        {
                                 UserId=1,
                                 UserName="张三",
                                 Birthday=DateTime.Parse("1987/1/1")
                         });
                        users.Add(new User
                        {
                                 UserId=2,
                                 UserName="李四",
                                  Birthday=DateTime.Parse("1986/12/2")
                        });
                        users.Add(new User
                        {
                                  UserId=3,
                                 UserName="王五",
                                 Birthday=DateTime.Parse("1980/8/4")
                         });

                   String json = JsonHelper.Serialize(users);
                         context.Response.Write(json);              //输出生成的json字符串,返回给前台处理
                 }

           public bool IsReusable
                  {
                         get
                         {
                                   return false;
                          }
                   }

           //[Serializable]这里不要加序列化这个属性,否则在前台获取时会不行
                 public class User
                 {
                         public int UserId { get; set; }
                         public String UserName { get; set; }
                         public DateTime Birthday { get; set; }
                  }
      }

下面我们再建立一个前台的页面,在前台,我们首先利用jquery的ajax方法调用刚建立的一般处理文件返回json字符串进行处理:

<script src="../JS/jquery.js" type="text/javascript"></script>
       <script type="text/javascript">
            $(document).ready(function(){
            //利用ajax获取返回的json然后处理结果
            $("#btnTwo").click(function(){
            alert("开始");
                $.ajax({
                    type:"POST",
                    contentType:"application/json;utf-8",    //注意这里哦
                   
url:"JSONHandler.ashx",
                    success:function(data){
                        var jsonsObj=eval_r('('+data+')');      //利用eval方法将返回的json字符串转换为对象
                        for(var i=0;i<jsonObj.length;i++)
                        {
                            alert("用户id:"+jsonObj[i].UserId+"用户名:"+jsonObj[i].UserName+"生日:"+jsonObj[i].Birthday);
                        }
                    }
                });
            });
        });
      </script>

另外,jquery中提供另外一个方法getJSON,可以更方便的处理上面的内容了,如下:

<script src="../JS/jquery.js" type="text/javascript"></script>
       <script type="text/javascript">
        $(document).ready(function(){
            $("#btnShow").click(function(){
                //利用jquery的getJSON方法获取从后台返回的json字符串
                $.getJSON("JSONHandler.ashx",function(data){
                    $.each(data,function(i){
                        alert("用户id:"+data[i].UserId+"用户名:"+data[i].UserName+"生日:"+data[i].Birthday);
                    });
                });
            });
         
});
      </script>

好了,就这么多了,赶快试试吧!哈哈……

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值