jQuery+json+servlet小例子1、引入jar包:gson-1.7.1(google提供的json解决方案),下载网站:http://code.goog
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 {@Overrideprotected 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();}@Overrideprotected void doPost(HttpServletRequest req, HttpServletResponse resp)throws ServletException, IOException {// TODO Auto-generated method stubthis.doGet(req, resp);}}4)web.xml配置
<?xml version="1.0" encoding="UTF-8"?><web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"><display-name></display-name><!-- Servlet在web.xml中的配置 --><servlet><servlet-name>JsonServlet</servlet-name><servlet-class>com.yjw.servlet.JsonServlet</servlet-class></servlet><servlet-mapping><servlet-name>JsonServlet</servlet-name><url-pattern>/JsonServlet</url-pattern></servlet-mapping><welcome-file-list><welcome-file>index.jsp</welcome-file></welcome-file-list></web-app>
