当前位置:Gxlcms > JavaScript > Json操作日期格式

Json操作日期格式

时间:2021-07-01 10:21:17 帮助过:5人阅读

这次给大家带来Json操作日期格式,Json操作日期格式的注意事项有哪些,下面就是实战案例,一起来看一下。

开发中有时候需要从服务器端返回json格式的数据,在后台代码中如果有DateTime类型的数据使用系统自带的工具类序列化后将得到一个很长的数字表示日期数据,如下所示:

  1. //设置服务器响应的
结果为纯文本格式 context.Response.ContentType = "text/plain"; //学生对象集合 List<Student> students = new List<Student> { new Student(){Name ="Tom", Birthday =Convert.ToDateTime("2014-01-31 12:12:12")}, new Student(){Name ="Rose", Birthday =Convert.ToDateTime("2014-01-10 11:12:12")}, new Student(){Name ="Mark", Birthday =Convert.ToDateTime("2014-01-09 10:12:12")} }; //javascript序列化器 JavaScriptSerializer jss=new JavaScriptSerializer(); //序列化学生集合对象得到json字符 string studentsJson=jss.Serialize(students); //将字符串响应到客户端 context.Response.Write(studentsJson); context.Response.End();

运行结果是:

其中Tom所对应生日“2014-01-31”变成了1391141532000,这其实是1970 年 1 月 1 日至今的毫秒数;1391141532000/1000/60/60/24/365=44.11年,44+1970=2014年,按这种方法可以得出年月日时分秒和毫秒。这种格式是一种可行的表示形式但不是普通人可以看懂的友好格式,怎么让这个格式变化?

解决办法:

方法1:在服务器端将日期格式使用Select方法或LINQ表达式转换后发到客户端:

  1. using System;
  2. using System.Collections.Generic;
  3. using System.Web;
  4. using System.Web.Script.Serialization;
  5. namespace JsonDate1
  6. {
  7. using System.Linq;
  8. /// <summary>
  9. /// 学生类,测试用
  10. /// </summary>
  11. public class Student
  12. {
  13. /// <summary>
  14. /// 姓名
  15. /// </summary>
  16. public String Name { get; set; }
  17. /// <summary>
  18. /// 生日
  19. /// </summary>
  20. public DateTime Birthday { get; set; }
  21. }
  22. /// <summary>
  23. /// 返回学生集合的json字符
  24. /// </summary>
  25. public class GetJson : IHttpHandler
  26. {
  27. public void ProcessRequest(HttpContext context)
  28. {
  29. //设置服务器响应的
结果为纯文本格式 context.Response.ContentType = "text/plain"; //学生对象集合 List<Student> students = new List<Student> { new Student(){Name ="Tom",Birthday =Convert.ToDateTime("2014-01-31 12:12:12")}, new Student(){Name ="Rose",Birthday =Convert.ToDateTime("2014-01-10 11:12:12")}, new Student(){Name ="Mark",Birthday =Convert.ToDateTime("2014-01-09 10:12:12")} }; //使用Select方法重新投影对象集合将Birthday属性转换成一个新的属性 //注意属性变化后要重新命名,并立即执行 var studentSet = students.Select ( p => new { p.Name, Birthday = p.Birthday.ToString("yyyy-mm-dd") } ).ToList(); //javascript序列化器 JavaScriptSerializer jss = new JavaScriptSerializer(); //序列化学生集合对象得到json字符 string studentsJson = jss.Serialize(studentSet); //将字符串响应到客户端 context.Response.Write(studentsJson); context.Response.End(); } public bool IsReusable { get { return false; } } } }

Select方法重新投影对象集合将Birthday属性转换成一个新的属性,注意属性变化后要重新命名,属性名可以相同;这里可以使用select方法也可以使用LINQ查询表达式,也可以选择别的方式达到相同的目的;这种办法可以将集合中客户端不用的属性剔除,达到简单优化性能的目的。

运行结果:

这时候的日期格式就已经变成友好格式了,不过在javascript中这只是一个字符串。

方法二:

在javascript中将"Birthday":"\/Date(1391141532000)\/"中的字符串转换成javascript中的日期对象,可以将Birthday这个Key所对应的Value中的非数字字符以替换的方式删除,到到一个数字1391141532000,然后实例化一个Date对象,将1391141532000毫秒作为参数,得到一个javascript中的日期对象,代码如下:

  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <title>json日期格式处理</title>
  5. <script src="Scripts/jquery-1.10.2.min.js" type="text/javascript"></script>
  6. <script type="text/javascript">
  7. $(function() {
  8. $.getJSON("getJson.ashx", function (students) {
  9. $.each(students, function (index, obj) {
  10. $("<li/>").html(obj.Name).appendTo("#ulStudents");
  11. //使用正则表达式将生日属性中的非数字(\D)删除
  12. //并把得到的毫秒数转换成数字类型
  13. var birthdayMilliseconds = parseInt(obj.Birthday.replace(/\D/igm, ""));
  14. //实例化一个新的日期格式,使用1970 年 1 月 1 日至今的毫秒数为参数
  15. var birthday = new Date(birthdayMilliseconds);
  16. $("<li/>").html(birthday.toLocaleString()).appendTo("#ulStudents"); ;
  17. });
  18. });
  19. });
  20. </script>
  21. </head>
  22. <body>
  23. <h2>json日期格式处理</h2>
  24. <ul id="ulStudents">
  25. </ul>
  26. </body>
  27. </html>

运行结果:

上的使用正则/\D/igm达到替换所有非数字的目的,\D表示非数字,igm是参数,分别表示忽视(ignore)大小写;多次、全局(global)替换;多行替换(multi-line);有一些时候还会出现+86的情况,只需要变换正则同样可以达到目的。另外如果项目中反复出现这种需要处理日期格式的问题,可以扩展一个javascript方法,代码如下:

  1. $(function () {
  2. $.getJSON("getJson.ashx", function (students) {
  3. $.each(students, function (index, obj) {
  4. $("<li/>").html(obj.Name).appendTo("#ulStudents");
  5. //使用正则表达式将生日属性中的非数字(\D)删除
  6. //并把得到的毫秒数转换成数字类型
  7. var birthdayMilliseconds = parseInt(obj.Birthday.replace(/\D/igm, ""));
  8. //实例化一个新的日期格式,使用1970 年 1 月 1 日至今的毫秒数为参数
  9. var birthday = new Date(birthdayMilliseconds);
  10. $("<li/>").html(birthday.toLocaleString()).appendTo("#ulStudents");
  11. $("<li/>").html(obj.Birthday.toDate()).appendTo("#ulStudents");
  12. });
  13. });
  14. });
  15. //在String对象中扩展一个toDate方法,可以根据要求完善
  16. String.prototype.toDate = function () {
  17. var dateMilliseconds;
  18. if (isNaN(this)) {
  19. //使用正则表达式将日期属性中的非数字(\D)删除
  20. dateMilliseconds =this.replace(/\D/igm, "");
  21. } else {
  22. dateMilliseconds=this;
  23. }
  24. //实例化一个新的日期格式,使用1970 年 1 月 1 日至今的毫秒数为参数
  25. return new Date(parseInt(dateMilliseconds));
  26. };

上面扩展的方法toDate不一定合理,也不够强大,可以根据需要修改。

方法三:

可以选择一些第三方的json工具类,其中不乏有一些已经对日期格式问题已处理好了的,常见的json序列化与反序列化工具库有:

1.fastJSON.
2.JSON_checker.
3.Jayrock.
4.Json.NET - LINQ to JSON.
5.LitJSON.
6.JSON for .NET.
7.JsonFx.
8.JSONSharp.
9.JsonExSerializer.
10.fluent-json
11.Manatee Json

这里以litjson为序列化与反序列化json的工具类作示例,代码如下:

  1. using System;
  2. using System.Collections.Generic;
  3. using System.Web;
  4. using LitJson;
  5. namespace JsonDate2
  6. {
  7. using System.Linq;
  8. /// <summary>
  9. /// 学生类,测试用
  10. /// </summary>
  11. public class Student
  12. {
  13. /// <summary>
  14. /// 姓名
  15. /// </summary>
  16. public String Name { get; set; }
  17. /// <summary>
  18. /// 生日
  19. /// </summary>
  20. public DateTime Birthday { get; set; }
  21. }
  22. /// <summary>
  23. /// 返回学生集合的json字符
  24. /// </summary>
  25. public class GetJson : IHttpHandler
  26. {
  27. public void ProcessRequest(HttpContext context)
  28. {
  29. //设置服务器响应的
结果为纯文本格式 context.Response.ContentType = "text/plain"; //学生对象集合 List<Student> students = new List<Student> { new Student(){Name ="Tom",Birthday =Convert.ToDateTime("2014-01-31 12:12:12")}, new Student(){Name ="Rose",Birthday =Convert.ToDateTime("2014-01-10 11:12:12")}, new Student(){Name ="Mark",Birthday =Convert.ToDateTime("2014-01-09 10:12:12")} }; //序列化学生集合对象得到json字符 string studentsJson = JsonMapper.ToJson(students); //将字符串响应到客户端 context.Response.Write(studentsJson); context.Response.End(); } public bool IsReusable { get { return false; } } } }

运行结果如下:

这时候的日期格式就基本正确了,只要在javascript中直接实例化日期就好了,

  1. var date = new Date("01/31/2014 12:12:12");
  2. alert(date.toLocaleString());

客户端的代码如下:

  1. $(function () {
  2. $.getJSON("GetJson2.ashx", function (students) {
  3. $.each(students, function (index, obj) {
  4. $("<li/>").html(obj.Name).appendTo("#ulStudents");
  5. var birthday = new Date(obj.Birthday);
  6. $("<li/>").html(birthday.toLocaleString()).appendTo("#ulStudents");
  7. });
  8. });
  9. });
  10. var date = new Date("01/31/2014 12:12:12");
  11. alert(date.toLocaleString());

方法四:

这点文字发到博客上有网友提出了他们宝贵的意见,我并没有考虑在MVC中的情况,其实MVC中也可以使用handler,所以区别不是很大了,但MVC中有专门针对服务器响应为JSON的Action,代码如下:

  1. using System;
  2. using System.Web.Mvc;
  3. namespace JSONDateMVC.Controllers
  4. {
  5. public class HomeController : Controller
  6. {
  7. public JsonResult GetJson1()
  8. {
  9. //序列化当前日期与时间对象,并允许客户端Get请求
  10. return Json(DateTime.Now, JsonRequestBehavior.AllowGet);
  11. }
  12. }
  13. }

运行结果:

下载一个内容为Application/json的文件,文件名为GetJson1,内容是"\/Date(1391418272884)\/"

从上面的情况看来MVC中序列化时并未对日期格式特别处理,我们可以反编译看源码:

Return调用的Json方法:

  1. protected internal JsonResult Json(object data, JsonRequestBehavior behavior)
  2. {
  3. return this.Json(data, null, null, behavior);
  4. }
  5. this.Json方法
  6. protected internal virtual JsonResult Json(object data, string contentType, Encoding contentEncoding, JsonRequestBehavior behavior)
  7. {
  8. return new JsonResult { Data = data, ContentType = contentType, ContentEncoding = contentEncoding, JsonRequestBehavior = behavior };
  9. }

JsonResult类ActionResult类的子类,ExecuteResult方法:

从上面的代码中不难看出微软的JsonResult类仍然是使用了JavaScriptSerializer,所以返回的结果与方法一未处理时是一样的,要解决这个问题我们可以派生出一个新的类,重写ExecuteResult方法,使用Json.net来完成序列化工作,JsonResultPro.cs文件的代码如下:

  1. namespace JSONDateMVC.Common
  2. {
  3. using System;
  4. using System.Web;
  5. using System.Web.Mvc;
  6. using Newtonsoft.Json;
  7. using Newtonsoft.Json.Converters;
  8. public class JsonResultPro : JsonResult
  9. {
  10. public JsonResultPro(){}
  11. public JsonResultPro(object data, JsonRequestBehavior behavior)
  12. {
  13. base.Data = data;
  14. base.JsonRequestBehavior = behavior;
  15. this.DateTimeFormat = "yyyy-MM-dd hh:mm:ss";
  16. }
  17. public JsonResultPro(object data, String dateTimeFormat)
  18. {
  19. base.Data = data;
  20. base.JsonRequestBehavior = JsonRequestBehavior.AllowGet;
  21. this.DateTimeFormat = dateTimeFormat;
  22. }
  23. /// <summary>
  24. /// 日期格式
  25. /// </summary>
  26. public string DateTimeFormat{ get; set; }
  27. public override void ExecuteResult(ControllerContext context)
  28. {
  29. if (context == null)
  30. {
  31. throw new ArgumentNullException("context");
  32. }
  33. if ((this.JsonRequestBehavior == JsonRequestBehavior.DenyGet) && string.Equals(context.HttpContext.Request.HttpMethod, "GET", StringComparison.OrdinalIgnoreCase))
  34. {
  35. throw new InvalidOperationException("MvcResources.JsonRequest_GetNotAllowed");
  36. }
  37. HttpResponseBase base2 = context.HttpContext.Response;
  38. if (!string.IsNullOrEmpty(this.ContentType))
  39. {
  40. base2.ContentType = this.ContentType;
  41. }
  42. else
  43. {
  44. base2.ContentType = "application/json";
  45. }
  46. if (this.ContentEncoding != null)
  47. {
  48. base2.ContentEncoding = this.ContentEncoding;
  49. }
  50. if (this.Data != null)
  51. {
  52. //转换System.DateTime的日期格式到 ISO 8601日期格式
  53. //ISO 8601 (如2008-04-12T12:53Z)
  54. IsoDateTimeConverter isoDateTimeConverter=new IsoDateTimeConverter();
  55. //设置日期格式
  56. isoDateTimeConverter.DateTimeFormat = DateTimeFormat;
  57. //序列化
  58. String jsonResult = JsonConvert.SerializeObject(this.Data,isoDateTimeConverter);
  59. //相应结果
  60. base2.Write(jsonResult);
  61. }
  62. }
  63. }
  64. }

使用上面的JsonResultPro Action类型的代码如下:

  1. public JsonResultPro GetJson2()
  2. {
  3. //序列化当前日期与时间对象,并允许客户端Get请求,注意H是大写
  4. return new JsonResultPro(DateTime.Now,"yyyy-MM-dd HH:mm");
  5. }

相信看了本文案例你已经掌握了方法,更多精彩请关注Gxl网其它相关文章!

推荐阅读:

jsonp+json实现AJAX跨域请求

Jsonp怎样才能解决ajax跨域

以上就是Json操作日期格式的详细内容,更多请关注Gxl网其它相关文章!

人气教程排行