日期:2014-05-16  浏览次数:20310 次

jQuery+json+servlet小例子

1、引入jar包:gson-1.7.1(google提供的json解决方案),下载网站:http://code.google.com/p/google-gson/

2、引入jQuery的js包

3、代码

1) 客户端代码(jsp代码)

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<base href="<%=basePath%>">
		<title>My JSP 'json.jsp' starting page</title>
		<!-- 去除浏览器缓存 -->
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">	
		<meta http-equiv="expires" content="0">
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

		<script type="text/javascript" src="scripts/jquery-1.6.1.js"></script>
		<!-- -->
		<script type="text/javascript">
			$(document).ready(function() {
				$("#btn1").click(function() {
					$.post(
						"JsonServlet", 
						{"name":"张三"},
						function(Date){
							//alert(Date);
							var html = "<table><tr><th>id</th><th>name</th><th>age</th><th>address</th><tr><td>"+Date.id+"</td><td>"+Date.name+"</td><td>"+Date.age+"</td><td>"+Date.address+"</td></tr></table>";
							$("#show").html(html);
						}, 
						"json"
					);
				});
			});
		</script>
	</head>

	<body>
		<input id="btn1" type="button" value="click me" />
		<div id="show"></div>
	</body>
</html>

2)服务器端代码(实体类Person)

package com.yjw.pojo;

public class Person {
	private int id;
	private String name;
	private int age;
	private String address;
	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 String getAddress() {
		return address;
	}
	public void setAddress(String address) {
		this.address = address;
	}
	
}

?

3)服务器端代码(servlet代码)

package com.yjw.servlet;

import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.google.gson.Gson;
import com.yjw.pojo.Person;

public class JsonServlet extends HttpServlet {
	@Override
	protected void doGet(HttpServletRequest req, HttpServletResponse resp)
			throws ServletException, IOException {
		
		Person person = new Person();
		person.setId(1);
		person.setName("张三");
		person.setAge(20);
		person.setAddress("suzhou");
		
		Gson gson = new Gson();
		String result = gson.toJson(person);
		//System.out.println(result);
		//服务器返回类型设置为json格式
		resp.setContentType("application/json; charset=utf-8");
		//清缓存
		resp.setHeader("pragma", "no-cache");
		resp.setHeader("cache-control", "no-cache");
		//服务器响应
		PrintWriter out = resp.getWriter();
		out.print(result);
		out.close();
	}
	
	@Override
	protected void doPost(HttpServletRequest req, HttpServletResponse resp)
			throws ServletException, IOException {
		// TODO Auto-generated me