Jquery解析json

中国凉茶 · 发表于 2013-1-29 13:27:58

jQuery解析JSON，通过异步调用的方式从服务器端获取对象，并以Json格式显示在客户端

1、jsp
<script type="text/javascript" src="scripts/jquery-1.6.2.min.js"></script> <script type="text/javascript">  $(function(){ $("#btn").click(function(){    $.post("GsonServlet",{},function(returnedData,status){       var html = "<table width='50%' border='1' align='center'><tr><th>id</th><th>name</th><th>age</th><th>homeAddress</th><th>companyAddress</th></tr>";       for(var i = 0;i<returnedData.length;i++){          var people = returnedData[i];          html += "<tr><td>"+people.id+"</td><td>"+people.name+"</td><td>"+people.age+"</td><td>"+people.address.homeAddress+"</td><td>"+people.address.companyAddress+"</td></tr>";    }       html += "</table>";       $("#theBody table:eq(0)").remove();       $("#theBody").append(html); }); });  }); </script>  </head>  <body id="theBody">  <input type="button" name="button" id="btn" value="Get Gson from Server">  </body>

2、服务器端的servlet

  public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {  List<People> list = new ArrayList<People>(); //创建第一个人  People people1 = new People(); Address address1 = new Address();  address1.setHomeAddress("Anhui");  address1.setCompanyAddress("Shanghai"); people1.setId(1);  people1.setName("James");  people1.setAge(29);  people1.setAddress(address1); People people12 = new People();  people12.setId(11);  people12.setName("laowang);  people12.setAge(30); People people13 = new People();  people13.setId(12);  people13.setName("laoliu");  people13.setAge(35); List<People> list1 = new ArrayList<People>();  list1.add(people12);  list1.add(people13); people1.setList(list1); //创建第二个人 People people2 = new People(); Address address2 = new Address();  address2.setHomeAddress("香港");  address2.setCompanyAddress("新加坡"); people2.setId(2);  people2.setName("刘德华");  people2.setAge(50);  people2.setAddress(address2); People people21 = new People();  people21.setId(21);  people21.setName("张学友");  people21.setAge(45);  People people22 = new People();  people22.setId(22);  people22.setName("张惠妹");  people22.setAge(100); List<People> list2 = new ArrayList<People>();  list2.add(people21);  list2.add(people22); people2.setList(list2); list.add(people1);  list.add(people2); Gson gson = new Gson(); String result = gson.toJson(list); System.out.println(result); response.setContentType("application/json; charset=utf-8");  response.setHeader("pragma", "no-cache");  response.setHeader("cache-control", "no-cache"); PrintWriter out = response.getWriter(); out.println(result); out.flush(); }

3、对应的bean有：
package com.lee.bean;import java.util.List;public class People { private int id;  private String name;  private int age;  private Address address;  private List<People> list; public int getId() {  return id; } public void setId(int id) {  this.id = id; } public String getName() {  return name; } public void setName(String name) {  this.name = name; } public int getAge() {  return age; } public void setAge(int age) {  this.age = age; } public Address getAddress() {  return address; } public void setAddress(Address address) {  this.address = address; } public List<People> getList() {  return list; } public void setList(List<People> list) {  this.list = list; } }=========================package com.lee.bean;public class Address { private String homeAddress; private String companyAddress; public String getHomeAddress() {  return homeAddress; } public void setHomeAddress(String homeAddress) {  this.homeAddress = homeAddress; } public String getCompanyAddress() {  return companyAddress; } public void setCompanyAddress(String companyAddress) {  this.companyAddress = companyAddress; }  }

		自动登录	找回密码
密码			立即注册