一、服务端数据格式
1.自定义po类
package com.hbut.ssm.po;/*** pojo类**/
public class Children {private String name;private Integer age;private String gender;public Children(String name, Integer age, String gender) {super();this.name = name;this.age = age;this.gender = gender;}public String getName() {return name;}public void setName(String name) {this.name = name;}public Integer getAge() {return age;}public void setAge(Integer age) {this.age = age;}public String getGender() {return gender;}public void setGender(String gender) {this.gender = gender;}}
2.controller准备需要返回的数据
//测试json的输出@RequestMapping(value="/getChildrenList")public @ResponseBody List<Children> getChildrenList(HttpServletRequest request){System.out.println("获取前端的参数："+request.getParameter("name"));List<Children> childrenList= new ArrayList<Children>();childrenList.add(new Children("张三", 25, "男"));childrenList.add(new Children("李四", 28, "男"));childrenList.add(new Children("小红", 22, "女"));return childrenList;}二、ajax请求并解析数据
方式1:不带参数 $ajax(url，callback)，即第一个参数是请求的url，第二个参数是回调用函数，json数据封装在result，需要对result的json数据进行解析
$(document).ready(function(){$("button").click(function(){$.ajax({url:"http://localhost:8080/ssm01/getChildrenList.action",success:function(result){//eval函数解析json数据var array=eval(result);var texts="解析json数据如下:<br>";for(var i=0;i<array.length;i++){texts+=array[i].name+"--"+array[i].age+"---"+array[i].gender+";<br>";}$("#div1").html(texts);}});});});方式2:带参数 $.post(url，data,callback)，即第一个参数是请求的url，第二个参数是请求参数，第三个参数是回调用函数，json数据封装在result，需要对result的json数据进行解析
$(document).ready(function(){$("button").click(function(){$.post("http://localhost:8080/ssm01/getChildrenList.action",{name:"菜鸟教程",url:"http://www.runoob.com"},function(data,status){//eval函数解析json数据var array=eval(data);var texts="解析json数据如下:<br>";for(var i=0;i<array.length;i++){texts+=array[i].name+"--"+array[i].age+"---"+array[i].gender+";<br>";}$("#div1").html(texts);});});});
方式三:请求为json方式，请求的参数格式json，返回的是json（与上面请求url不一样，原理类似）
//请求json，输出是json
function requestJson(){$.ajax({type:'post',url:'${pageContext.request.contextPath }/requestJson.action',contentType:'application/json;charset=utf-8',//数据格式是json串，商品信息data:'{"name":"手机","price":999}',success:function(data){//返回json结果alert(data);}});}方式四:请求为key、value方式，返回的是json，（与上面请求url不一样，原理类似）
//请求key/value，输出是json
function responseJson(){$.ajax({type:'post',url:'${pageContext.request.contextPath }/responseJson.action',//请求是key/value这里不需要指定contentType，因为默认就 是key/value类型//contentType:'application/json;charset=utf-8',//数据格式是json串，商品信息data:'name=手机&price=999',success:function(data){//返回json结果alert(data.name);}});}
