Ajax 异步或取后台数据json显示到页面

来源：互联网发布：8051单片机实践与应用编辑：程序博客网时间：2024/05/01 05:43

今天心情很好，终于写出来了用Ajax异步获取数据，不刷新页面。

后台方法：

@RequestMapping("/uspaces.html" )
public void getUserSpace(HttpServletRequest request,HttpServletResponse response,String userName) throws IOException{
// String rtn="";
// PrintWriter out = response.getWriter();
// out.print(rtn);
// out.flush();
// out.close();
System.out.println(userName);
List<ViewSpace> viewSpaces = viewSpaceService.getAllSpaces();
String rtn=JsonUtil.list2json(viewSpaces);
System.out.println(rtn);
response.setCharacterEncoding("UTF-8");
// response.getWriter().write("{\"success\":true, \"data\":" + JsonUtil.list2json(viewSpaces) + "}");
// String rtn = "{\"success\":true, \"data\":" + JsonUtil.list2json(viewSpaces) + "}";
// response.getWriter().print(rtn);
response.getWriter().write(rtn);
response.getWriter().flush();
response.getWriter().close();
}

前台Ajax：

$("#sub").click(function(){
var userName=$("#userName").val();
alert(userName);
$.post(
"<%= basePath %>manageSpaces/uspaces.html",
{userName:userName //提交参数
},
function(rtn){
alert(rtn);//

// eval("data="+rtn);
// var data=eval(rtn);
// var data=rtn.prototype.evalJSON = function(){
// return eval('(' + this + ')');
// };
var json = (new Function('return '+rtn +';'))(); //Json字符串变成Json对象
alert(json);
var text='';
$(json).each(function(){
text+='<a>'+this.spaceName+'</a>&nbsp&nbsp&nbsp<a>'+this.address+'</a><br>';
});
alert(text);
$("#spacelist").html(text);
}

);
});

在后台拼接出来的字符串10个对象：[{"字段名":"值"，"字段名":"值"，"字段名":"值"........},{"字段名":"值"，"字段名":"值"，"字段名":"值"........},{"字段名":"值"，"字段名":"值"，"字段名":"值"........},..........]

[{"address":"黑龙江","beenNum":"1","briefDesc":"","description":"","nowantNum":"1","spaceId":"1","spaceName":"哈尔滨","user":{"lastLoginIp":"","lastLoginTime":"","password":"123","userId":"1","userName":"yezi"},"wantNum":"1","website":""},{"address":"黑龙江","beenNum":"1","briefDesc":"","description":"","nowantNum":"1","spaceId":"2","spaceName":"伊春","user":{"lastLoginIp":"","lastLoginTime":"","password":"123","userId":"3","userName":"jiajia"},"wantNum":"1","website":""},{"address":"辽宁省","beenNum":"3","briefDesc":"","description":"","nowantNum":"5","spaceId":"3","spaceName":"沈阳","user":{"lastLoginIp":"","lastLoginTime":"","password":"123","userId":"1","userName":"yezi"},"wantNum":"2","website":""},{"address":"北京市","beenNum":"4","briefDesc":"","description":"","nowantNum":"5","spaceId":"4","spaceName":"北京","user":{"lastLoginIp":"","lastLoginTime":"","password":"123","userId":"2","userName":"quanquan"},"wantNum":"3","website":""},{"address":"中国","beenNum":"7","briefDesc":"","description":"","nowantNum":"8","spaceId":"5","spaceName":"张家界","user":{"lastLoginIp":"","lastLoginTime":"","password":"123","userId":"5","userName":"caicai"},"wantNum":"6","website":""},{"address":"中国","beenNum":"1","briefDesc":"","description":"","nowantNum":"2","spaceId":"6","spaceName":"景德镇","user":{"lastLoginIp":"","lastLoginTime":"","password":"123","userId":"2","userName":"quanquan"},"wantNum":"3","website":""},{"address":"辽宁","beenNum":"1","briefDesc":"","description":"","nowantNum":"0","spaceId":"7","spaceName":"大连","user":{"lastLoginIp":"","lastLoginTime":"","password":"123","userId":"4","userName":"feifei"},"wantNum":"3","website":""},{"address":"吉林","beenNum":"2","briefDesc":"","description":"","nowantNum":"0","spaceId":"8","spaceName":"长春","user":{"lastLoginIp":"","lastLoginTime":"","password":"123","userId":"4","userName":"feifei"},"wantNum":"1","website":""},{"address":"云南","beenNum":"1","briefDesc":"","description":"","nowantNum":"0","spaceId":"9","spaceName":"大理","user":{"lastLoginIp":"","lastLoginTime":"","password":"admin","userId":"6","userName":"admin"},"wantNum":"1","website":""},{"address":"中国","beenNum":"2","briefDesc":"","description":"","nowantNum":"1","spaceId":"10","spaceName":"上海","user":{"lastLoginIp":"","lastLoginTime":"","password":"admin","userId":"6","userName":"admin"},"wantNum":"1","website":""}]

0 0