需要jquery插件
1 ajax提交 页面准备
<%@page import="javax.xml.ws.RequestWrapper"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<% String basePath = request.getScheme()+"://"+ request.getServerName()+":"+request.getLocalPort()+request.getContextPath(); %>
<%=basePath %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="<%=basePath %>/resource/js/json2.js" ></script>
<script type="text/javascript" src="<%=basePath %>/resource/js/jquery-1.7.1.min.js" ></script>
<script type="text/javascript">
function sendRequest(){
var uu = "jsondemo";
$.ajax({
type:"get",
dataType:"json",
url:"jsondemo",
data:{"a":1,"b":2},
success:function(data){
alert(JSON.stringify(data));
$.each(data,function(name,value) {
alert(name+":"+value);
});
}
});
}
</script>
</head>
<body>
<h2>Hello Daotie</h2>
<input type="button" value=" json demo " onclick="sendRequest()">
</body>
</html>
2 web.xml配置
<servlet>
<servlet-name>JsonDemo</servlet-name>
<servlet-class>com.daotie.servlet.JsonServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>JsonDemo</servlet-name>
<url-pattern>/jsondemo</url-pattern>
</servlet-mapping>
3 Servlet类
package com.daotie.servlet;
import java.io.IOException;
import java.util.HashMap;
import java.util.Map;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import net.sf.json.JSONObject;
public class JsonServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
public JsonServlet() {
super();
// TODO Auto-generated constructor stub
}
protected void doGet(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
System.out.println("doGet");
String a = request.getParameter("a");
System.out.println(a);
Map<Object,Object> map = new HashMap<Object, Object>();
JSONObject json = new JSONObject();
map.put("name", "admin");
map.put("password", "123");
json.putAll(map);
System.out.println(json.toString());
response.getWriter().print(json.toString());
}
protected void doPost(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
}
}
最后部署到jetty上或者tomcat上试试。
说明 在学习中发现 js部分的json.js脚本和jquery脚本有冲突, 网上人说建议使用json2.js 并且要先于jquery引入。
可以无法使用 parseJSON();和toJSONString()这两个函数。
希望对你有帮助。
分享到:
相关推荐
SSH +jquery+json做的Ajax级联操作 简练清晰 容易理解 完全可以拷贝引用
jquery+json+jsp+databasejquery+json+jsp+databasejquery+json+jsp+databasejquery+json+jsp+database
struts2+spring+hibernate+jquery+json 以前没有做过此类的东西终于有时间来试试 可以方便学习
Springmvc+maven+ajax+jquery+json+mybatis做的登录,注册,增删改查详细注释,大家可以来一下,看看对自己有没有帮助哈,这是我自己一点点的打的,采用MyEclipse 10运行出来.并且付有sql脚本.可直接导入运行.并且经本人...
Ajax无刷新分页(jQuery+Json) 做了一个用jQuery来实现的用户控件,VS2008+Access jQuery+ashx+JSON 用ashx来接收请求,数据格式为JSON 实现了批量(选择)操作,编辑接口(反回两个值给用户进行自定义操作) 删除,...
jquery+ajax+json例子,是一个web例子
Servlet+jsp+js(Jquery)+json实现分页,自己写的,比较完美的分页!!so easy 不像网上写的那么复杂!代码容易理解!思路清晰!有需要的童鞋可以拿去看看。
jquery+json的无刷新分页 jquery+json的无刷新分页 jquery+json的无刷新分页 jquery+json的无刷新分页
Jquery+JSON+REST WCF DEMO
Struts1.3+Hibernate3.2+Spring2.5+JQuery1.3
Java+Servlet+Jquery+Json基础示例
基于Jquery+Ajax+Json实现分页显示附效果图
ajax,jquery,json一个页面实现Ajax效果的增删改查-JQuery+Json版.zip
一个jquery+json 数据传递的 实例工程,代码注释详细,很适合 初学者,这是我帮老弟打的,希望可以帮到其他人
Ajax无刷新分页(jQuery+Json) 做了一个用jQuery来实现的用户控件,VS2008+Access 只用来玩玩.所以就用Access数据库了 jQuery+ashx+JSON 用ashx来接收请求,数据格式为JSON 实现了批量(选择)操作,编辑接口(反回...
Ajax分页 C# +jquery +jsonAjax分页 C# +jquery +json
基于jquery+json实现的网站后台管理中无刷新的分类管理功能演示,如上图演示所示,可无刷新添加一个分类、在动画弹出的对话框中输入分类名称即可实现保存,同进还可无刷新删除二级分类,删除一级分类,修改分类,...
Jquery+JSON+WebService交互
Jquery+json+Csharp实例,方便用户快速掌握Jquery+json技术, 代码放入网站即可用,已调试成功。
利用jQuery+Ajax+json从数据库获取数据,将获取的数据利用json格式传递,实现select控件三级联动;内附数据库sql脚本。