使用jQuery封装好的ajax方法进行ajax交互,节约了很多不必要的代码,也不用进行,浏览器兼容了。
这里使用的是.ajax方法,配置完web.xml 中的servlet之后,后台代码如下:<post方法>
//@ Saa
public void doPost(HttpServletRequest request,HttpServletResponse response)
throws ServletException, IOException
{
System.out.println("---------------------");
String name = request.getParameter("name");//获得ajax传的值
System.out.println(name+"=======");
String str = "";
//自定义的一个Person对象
Person p=new Person();
p.setAddress("1");
p.setAge(18);
p.setUname("2");
//转化为JSON String
Gson gson=new Gson();
str = gson.toJson(p);
//关于response的必要设置
response.setCharacterEncoding("utf-8");
response.setContentType("application/json;charset=utf-8");
response.setHeader("pragma","no-cache");
response.setHeader("cache-control","no-cache");
//传输JSON
PrintWriter out = response.getWriter();
out.println(str);
out.flush();
}
//END ~
前端的SCRIPT
<scripttype="text/javascript">
$(document).ready(function(){
$("#kick").click(function(){
$.ajax({
type:"post",//post方法
url:"CheckServlet",
data:{"name":$("#uname").val(),"case":"small"},
//ajax成功的回调函数
success:function(returnData){
var state=returnData.uname;//取得对象属性,这里要考虑将返回的json数据转型成对象,参考eval方法博文
var time=returnData.age;
$("#result").html(state+":"+time);
}
});
});
});
</script>