简单介绍json+jquery使用
在上一个项目用到ajax的地方非常多，现在对其进行一个总结。
在做项目的时候主要用到了jquery+json。之所以选择jquery而没用dwr来接收后台传过来的数据是因为jquery很轻，不会像DWR那样有繁琐的配置。Json也会有很多第三方的工具，现在用的比较多的是json-lib和org.json，对应选择哪种根据自己的喜好，json-lib和org.json的操作方式基本是一样的，个人认为json-lib依赖的包比较多，如下图：
Json-lib requires (at least) the following dependencies in your classpath:
- jakarta commons-lang 2.4
- jakarta commons-beanutils 1.7.0
- jakarta commons-collections 3.2
- jakarta commons-logging 1.1.1
- ezmorph 1.0.6
而org..json直接下载包就可以直接使用，相对来说比较前者依赖轻，但是json-lib对于属性的支持比较好一些，比方说处理hibernate的级联关系的pojo数据生成问题，在处理存在级联关系的pojo时，使用fromObject时就会报：net.sf.json.JSONException: There is a cycle in the hierarchy!，使得生成json掉入了级联的循环陷阱中，处理方法如下：
Java代码
JsonConfig jsonConfig = new JsonConfig(); jsonConfig.setCycleDetectionStrategy(CycleDetectionStrategy.LENIENT); String[] excludes = { "poNewsArticle", "class" }; jsonConfig.setExcludes(excludes); PoNewsComment c=newsService.getCommentById(id); JSONObject jsonObject = JSONObject.fromObject(c); System.out.println(jsonObject.toString()); JsonConfig jsonConfig = new JsonConfig(); jsonConfig.setCycleDetectionStrategy(CycleDetectionStrategy.LENIENT); String[] excludes = { "poNewsArticle", "class" }; jsonConfig.setExcludes(excludes); PoNewsComment c=newsService.getCommentById(id); JSONObject jsonObject = JSONObject.fromObject(c); System.out.println(jsonObject.toString());
PoNewsComment.java
Java代码
public class PoNewsComment implements java.io.Serializable { // Fields private Integer commentId; private PoNewsArticle poNewsArticle;//关联的新闻的pojo private String comment; private String commenter; private Date commentTime; private short commentStatus; private String commenterIp; //省略set、get方法 }
其实其他的情况都可以使用JsonConfig来处理，包括时间转换，数据类型的转换等等。
那么下面对org..json的使用进行详细介绍：
其实org.json里2个重要的类就是JSONObject.java和JSONArray.java2个类，
JSONObject的主要作用就是对对象进行键/值对的存储，而JSONArray是提供了数组形式的存储。
下面来看下代码：
public class User { private String name; private String id; private List list; //set/get略; }
Servlet代码如下：
public class TestJson extends HttpServlet { protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub response.setContentType("text/html;charset=gb2312"); List list = new ArrayList(); List list1 = new ArrayList(); list.add("s1"); list.add("s2"); User u = new User(); u.setId("1"); u.setName("2"); u.setList(list); User u1 = new User(); u1.setId("3"); u1.setName("4"); u1.setList(list); list1.add(u); list1.add(u1); JSONArray arr = new JSONArray(); arr.put(list1); //arr.put("s2"); String s = arr.toString(); PrintWriter out = response.getWriter(); out.print(s); out.close(); System.out.println(s); } }
我们看到控制台输出：
[[{"list":["s1","s2"],"name":"2","id":"1"},{"list":["s1","s2"],"name":"4","id":"3"}]]
前台我们用jquery来接受 <script type="text/javascript" src="<%=basePath%>jquery.js" ></script> <script type="text/javascript"> function json(){ $.post("json",{"a":"1"},function (data){ alert(data[0][0].list[0]); //我们得到第一个数组的list的s2 }, "json" ); } </script> </head> <body> <input type="button" value="测试json" onclick="json();" /> </body>
这里不得不提下jquery的一个bug，就是JQuery.post(url,[data],[callback],[type])里第2个参数必须为填上，也就是上面代码中红色部分，如果是如下的话
function json(){ $.post("json",function (data){ alert(data[0][0].list[0]); //我们得到第一个数组的list的s2 }, "json" ); }
那么
jquery不管你最好的参数是否设置的是接收“json”数据格式 ，都无效。也就是说不会以json数据格式进行接收，所以我们我随便填了一个数据。
下面来看下如何用JSONObject protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub response.setContentType("text/html;charset=gb2312"); List list = new ArrayList(); List list1 = new ArrayList(); list.add("s1"); list.add("s2"); User u = new User(); u.setId("1"); u.setName("2"); u.setList(list); User u1 = new User(); u1.setId("3"); u1.setName("4"); u1.setList(list); list1.add(u); list1.add(u1); //JSONArray arr = new JSONArray(); JSONObject arr = new JSONObject(); try { arr.put("test", list1); } catch (JSONException e) { // TODO Auto-generated catch block e.printStackTrace(); } //arr.put(list1); //arr.put("s2"); String s = arr.toString(); PrintWriter out = response.getWriter(); out.print(s); out.close(); System.out.println(s); }
，
输入格式为：
{"test":[{"list":["s1","s2"],"name":"2","id":"1"},{"list":["s1","s2"],"name":"4","id":"3"}]}
前台接收就是
function json(){ $.post("json",{"a":"1"},function (data){ alert(data.test[0].list[1]); }, "json" ); }
简单介绍到此