ajax传递json到servlet servlet传递json到ajax

1.index.jsp 一个简单的表单

<form id="testform">
		姓名<input type="text" name="username"> 
		密码<input type="text" name="password">
		<button οnclick="login()">序列化</button>
	</form>

2.index.jsp中的ajax
（1）ajax用< scritpt >标签包围，第一个script标签里必须有src属性，属性值是jQuery文件的路径（相对绝对都行，这里使用绝对路径，jQuery请自行百度如何下载）

（2）ajax中注意url怎么写，servlet的映射地址是/loginServlet，但是url中需要把/去掉

（3）ajax和form action提交数据给后台的不同之处在于，form的属性中有action和method，直接把权限交给后台，ajax的form不用这么写，form的属性只需要有class或id属性就行，实现了前后端的分离

<script src="<%=basePath%>/js/jQuery.js"></script>
<script>
	function login() {
		var dataObj = $("#testform").serialize();
		$.ajax({
			url : "loginServlet",//发送请求的地址 处理请求的servlet的地址 没有前面的/
			type : "post",
			dataType : "json",//预计返回的数值类型
			data : dataObj,//发送到服务器的数据
			cache : false,
			ifModified : true,
			error : function(request) { //失败的话
				alert("Connection error");
			},
			success : function(json) {//请求成功后回调函数
				alert("before");
				if (json.flag == "success")
					alert("success!!");
				else
					alert("not catch");
			}
		})
	}
</script>

3.servlet的doPost方法
（1）这里需要注意在第一个response.setContentType里面，必须是text/html或text/plain（text/plain我没有试过，但是text/html一定可以）,不能写成text/json

（2）ajax传递到后台之后，servlet直接通过request.getParameter获取参数，就跟jsp的表单操作是一样的。

（3）这里需要import一些包：
import net.sf.json.JSONObject;
import net.sf.json.JSONArray;//这里的代码并没有用到JSONArray，所以不用import这个

（4）response.getWriter().print(jsonobj.toString)这句完成把json从后台传到前台的功能，前台的ajax接收，在success属性里对传过来的json加以处理

public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		response.setContentType("text/html; charset=utf-8");
		PrintWriter out = response.getWriter();
		request.setCharacterEncoding("UTF-8");
		try {

			String username = request.getParameter("username");
			// System.out.println(username);//获取ajax传递的数据 成功

			JSONObject jsonobj = new JSONObject();
			jsonobj.put("flag", "success");
			// System.out.println(jsonobj);//测试输出 成功
			out.print(jsonobj.toString());// 返回数据到js中ajax
		} catch (Exception e) {
			e.printStackTrace();
		}
		;
		out.flush();
		out.close();
	}

执行结果如下：