jQuery+json+servlet小例子
2011-09-15 10:05
218 查看
1、引入jar包:gson-1.7.1(google提供的json解决方案),下载网站:http://code.google.com/p/google-gson/
2、引入jQuery的js包
3、代码
1) 客户端代码(jsp代码)
Html代码
<%@ 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)
Java代码
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代码)
Java代码
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 method stub this.doGet(req, resp); } }
4)web.xml配置
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>
相关文章推荐
- servlet+jquery+ajax+json 例子
- jQuery 和 json 简单例子(注意callback函数的处理!!) (servlet返回json,jquery更新,java json)
- java servlet+jquery+json学习小例子
- java servlet+jquery+json学习小例子
- servlet+jquery+ajax+json 例子
- jQuery 和 json 简单例子(注意callback函数的处理!!) (servlet返回json,jquery更新,java json)
- servlet+jquery+ajax+json 例子
- 转摘 JQUERY操作JSON例子
- ajax+json+jquery第一个mvc例子
- jQuery获取servlet返回的JSON
- servlet+jquery+json实现数据传输
- 本文简单讲诉jQuery处理json与ajax返回的Json的一个例子
- jquery ajax 和servlet json 结合的简单小例子
- php+jquery+ajax+json简单小例子
- Highcharts + jQuery + Servlet 实现从后台获取JSON实时刷新图表
- 企业开发中js,Jquery,Ajax和json格式的一个例子
- Ubuntu 14.04 Web 程序开发(4)基于JQuery+Ajax+Json+Servlet实现PUT GET
- Jquery+ajax+json+servlet原理和Demo
- JQuery Servlet Json 下拉框级联
- jQuery操作JSON、服务端操作JSON(Servlet、SpringMVC)