jquery获取JSON并动态创建标签显示JSON内容

最新推荐文章于 2024-06-13 23:39:38 发布

T_白日梦想家

最新推荐文章于 2024-06-13 23:39:38 发布

阅读量4.1k

点赞数

分类专栏：前端开发文章标签： jquery json json显示

本文链接：https://blog.csdn.net/a632189007/article/details/45953165

版权

前端开发专栏收录该内容

12 篇文章 0 订阅

订阅专栏

后台代码：

test.java

protected ModelAndView handle(HttpServletRequest request, HttpServletResponse response) throws Exception {

JSONArray array = new JSONArray();
for(int i = 0; i < 10; i++){
JSONObject json = new JSONObject();
json.put("name", "哇哈哈");
json.put("age", 13);
json.put("sex", "男");
array.add(json);
}

response.setContentType("text/html; charset=utf-8");
response.getWriter().write(array.toJSONString());
response.getWriter().flush();

return null;

}

此处的后台代码使用的是springmvc，也可通过struts2或servlet获取json

前台代码：

jquery 代码：

$("document").ready(function(){
$("#button").click(function(){
var sendData = {"method":"json"};
var url = "mainFrameRight.do";
$.getJSON(url,sendData,function(backData){
for(i = 0;i < backData.length; i++){
var tr = $("<tr></tr>");
tr.appendTo($(".bbb"));

var td1 = $("<td>"+backData[i].name+"</td>");
td1.appendTo(tr);
var td2 = $("<td>"+backData[i].age+"</td>");
td2.appendTo(tr);
var td3 = $("<td>"+backData[i].sex+"</td>");
td3.appendTo(tr);
}
});
});
});