仿JSON做的数据传输

最新推荐文章于 2025-08-19 23:22:50 发布

最新推荐文章于 2025-08-19 23:22:50 发布 · 130 阅读

文章标签：

#json #Servlet #Ajax #Bean #Microsoft

java 专栏收录该内容

13 篇文章

订阅专栏

仿JSON做的数据传输。后台生成一个JSON数组，前台负责解析数组，然后展示。把后台的List截断成一个JSON的数组，然后通过reponse返回至页面，页面再解析此JSON数组然后在展示此数据。具体操作：

[b]1。[/b]写一个javaBean，在bean里面写一个toJSON()，封装属性名和值然后用String方式返回；

[b]2。[/b]写一个servlet, 在其中写一个得到list的一个结果集；

[b]3。[/b]写个HTML页面，由Ajax的方式异步提交到Servlet中，然后返回Servlet中的值，再在页面上用Ajax的xmlHttp得到json数组然后通过eval()解析，然后拼装到页面展示.

具体代码如下：

javaBean:

package com.haixiao.bean;

public class User {
　　private Long userId;
　　private String userName;
　　private String firstName;
　　 private String middleName;
　　private String address;
　　 public User() {

　　 }

　　public Long getUserId() {
　　　　return userId;
　　}

　　public void setUserId(Long userId) {
　　　　 this.userId = userId;
　　 }

　　public String getUserName() {
　　　　return userName;
　　 }

　　public void setUserName(String userName) {
　　　　 this.userName = userName;
　　}

　　 public String getFirstName() {
　　　　 return firstName;
　　}

　　public void setFirstName(String firstName) {
　　　　 this.firstName = firstName;
　　 }

　　public String getMiddleName() {
　　　　 return middleName;
　　}

　　public void setMiddleName(String middleName) {
　　　　 this.middleName = middleName;
　　}

　　 public String getAddress() {
　　　　 return address;
　　}

　　public void setAddress(String address) {
　　　　 this.address = address;
　　 }

　　public String toJSON() {
　　　　　String json = "{'userId':'"+this.getUserId() + "','userName':'"
　　　　　　　　　　 + this.getUserName() + "','firstName':'"
　　　　　　　　　　+ this.getFirstName() +"','middleName':'" + this.getMiddleName()
　　　　　　　　　　 +"','address':'" + this.getAddress() + "'}";
　　　　 return json;
　　 }
}

前台页面示例：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<META content="text/html; charset=gb2312" http-equiv=Content-Type>
<title>Example</title>
</head>
<script type="text/javascript">
　　var xmlHttp;
　　function createXMLHttpRequest() {
　　　　 if (window.ActiveXObject) {
　　　　　　 xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
　　　　 } else if (window.XMLHttpRequest) {
　　　　　　 xmlHttp = new XMLHttpRequest();
　　　　 }
　　}

　　 function handleStateChange() {
　　　　 if(xmlHttp.readyState == 4) {
　　　　　　 if(xmlHttp.status == 200) {
　　　　　　　　 parseResults();
　　　　　　 }
　　　　}
　　 }

　　function parseResults() {
　　　　 var json = xmlHttp.responseText;
　　　　 eval("var resq = " + json );
　　　　 var jsonUser = resq.user;
　　　　var outText = "<table border=1><tr><td>用户ID</td><td>用户姓名</td><td>用户姓氏　　　　　　　　　　</td><td>用户中间名</td><td>用户地址</td></tr>";
　　　　for(var i = 0 ; i < jsonUser.length;i++){
　　　　　　 var val = eval(jsonUser[i]);
　　　　　　 outText += "<tr><td>"+val.userId+"</td>" +
　　　　　　　 "<td>"+val.userName+"</td>" +
　　　　 "<td>"+val.firstName+"</td>" +
　　　　 "<td>"+val.middleName+"</td>" +
　　　　　"<td>"+val.address+"</td></tr>";
　　　　}
　　　　 outText += "</table>";
　　　　 serverResponse.innerHTML=outText;
　　 }

　　function getListData() {
　　　　 createXMLHttpRequest();
　　　　var url = "JsonExample?timeStamp="+new Date().getTime();
　　　　 xmlHttp.open("GET", url, true);
　　　　 xmlHttp.onreadystatechange = handleStateChange;
　　　　xmlHttp.send(null);
　　 }
</script>
<body>
　　 <br/><br/>
　　　　 <form action="#">
　　　　　　 <input type="button" value="list集合" onclick="getListData();" />
　　　　</form>
　　<br>
　　 <h2>集合列表:</h2>
　　<div id="serverResponse"></div>
</body>
</html>

servlet:

package ajax.communicate;

import java.io.BufferedReader;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.haixiao.bean.User;

public class JsonExample extends javax.servlet.http.HttpServlet implements javax.servlet.Servlet 　　{
　　 static final long serialVersionUID = 1L;

　　public JsonExample() {
　　　　 super();
　　 }

　　 /**
　　 * 得到一个List集合，里面包含一个用户对象。通过循环把list拼装成一个String然后打出到　　页面
　　 */
　　 protected void doGet(HttpServletRequest request, HttpServletResponse response) throws 　　　　ServletException, IOException {
　　　　 List<User> list = new ArrayList<User>();
　　　　 User user1 = new User();
　　　　 user1.setUserId(1L);
　　　　user1.setUserName("小王");
　　　　user1.setFirstName("王");
　　　　user1.setMiddleName("猛");
　　　　 user1.setAddress("上海市");
　　　　User user2 = new User();
　　　　user2.setUserId(2L);
　　　　user2.setUserName("小黑");
　　　　user2.setFirstName("黑");
　　　　user2.setMiddleName("楠");
　　　　user2.setAddress("不详");
　　　　User user3 = new User();
　　　　 user3.setUserId(3L);
　　　　user3.setUserName("小刘");
　　　　 user3.setFirstName("刘");
　　　　 user3.setMiddleName("大伊");
　　　　 user3.setAddress("北京");
　　　　list.add(user1);
　　　　list.add(user2);
　　　　 list.add(user3);
　　　　 String json = "{user:[" ;
　　　　 for(int i = 0 ; i < list.size();i++) {
　　　　　　 json += list.get(i).toJSON();
　　　　　　 if(i != list.size()-1){
　　　　　　　　 json = json + ",";
　　　　　　 }
　　　　 }
　　　　 json += "]}";
　　　　 response.setContentType("text/xml");
　　　　 response.setCharacterEncoding("gb2312");
　　　　 response.getWriter().println(json);
　　 }

　　 protected void doPost(HttpServletRequest request, HttpServletResponse response) throws 　　　　ServletException, IOException {
　　　　 this.doGet(request, response);
　　 }
}

web.xml:

<servlet>
　　 <description>
　　</description>
　　<display-name>
　　　　 JsonExample

　　</display-name>
　　 <servlet-name>JsonExample</servlet-name>
　　<servlet-class>
　　　　 ajax.communicate.JsonExample

　　</servlet-class>
</servlet>

<servlet-mapping>
　　 <servlet-name>JsonExample</servlet-name>
　　 <url-pattern>/JsonExample</url-pattern>
</servlet-mapping>