jQuery AJAX 方法success()后台传来的4种数据详解
程序员文章站
2022-10-08 17:05:38
1.后台返回一个页面
js代码
/**(1)用$("#content-wrapper").html(data);显示页面*/
$.ajax({
async...
1.后台返回一个页面
js代码
/**(1)用$("#content-wrapper").html(data);显示页面*/ $.ajax({ async : false, cache : false, type : 'post', url : 'area/preparecreate', error : function() { alert('smx失败 '); }, success : function(data) { $("#content-wrapper").html(data); } });
java代码
/* * (1)不能有注解@respoonsebody * (2)返回值类型是string,代表页面所在的文件夹 * (3)如果返回"error",执行ajax的error方法 */ @requestmapping(value = "area/preparecreate", method = requestmethod.post) public string editareawithfile() { return "area/create; // return "error"; }
2. 后台返回一个基本类型string,long等
js代码
$.ajax({ async : false, cache : false, type : 'post', url : 'app/area/delete', datatype : "json", error : function() { alert('smx失败 '); }, success : function(data) { /**重点:前台接收到返回值,直接处理就行*/ alert(data); } });
java代码
/**(1)用@responsebody注解 (2)可以接收各种参数,url,data(名称匹配或@requestbody) (3)返回值类型就是基本类型*/ @responsebody @requestmapping(value = "area/delete", method = requestmethod.post) public long editarea() { //处理参数 return 3; }
3. 后台返回一个实体类
第一步:定义一个实体类
/** * flag为1 :操作失败 * msg:失败原因; * flag为0: 操作成功*/ public class ajaxresponsemsg { private int flag; private string msg; }
第二步:js代码
$.ajax({ async : false, cache : false, type : 'post', url : 'app/area/delete', error : function() { alert('smx失败 '); }, success : function(data) { var jsondata = json.parse(data); if (jsondata .flag == 0) {//请求成功 alert("后台操作成果"); } else { alert(jsondata .msg); } } });
第三步:java代码
/**(1)添加注解@responsebody (2)可以接收参数 (3)返回类型就是实体类*/ @responsebody @requestmapping(value = "area/delete", method = requestmethod.post) public ajaxresponsemsg editareawithfile() { // 做操作 boolean result = true ajaxresponsemsg ajaxmsg = new ajaxresponsemsg(); if (result == true) ajaxmsg.setflag(0); else { ajaxmsg.setflag(1); ajaxmsg.setmsg("不能给一个传感器添加重复设备"); } return ajaxmsg; // 返回给前台一个实体类,包括是否操作成功,及失败原因 }
4.后台返回一个实体类list(实体类的字段都是基本类型)
实体类
public class section{ private long id; //id private string name; //名称 }
前台
$.ajax({ async : false, cache : false, type : 'post', url : "section/getsections", error : function() { alert("失败"); }, success : function(data) { var jsondata = json.parse(data); //jsondata是该下路下的所有区间(json格式) for (var i = 0; i < jsondata.length; i++) { alert(jsondata[i].id); alert(jsondata[i].name); } } })
后台
@responsebody @requestmapping("/section/getsections") @requirespermissions("section:view") public list<section> getsections() { list<section> sections = new list<section>(); return sections; }
5.后台返回一个实体类list(实体类的字段包括list类型)
第一步:定义实体类chartseries
public class chartseries { private string name; //曲线名称 private list<float> data; //曲线的纵坐标 private list<date> occurtime; //曲线的横坐标 //添加get set方法 }
第二步:js代码
$.ajax({ url : "/datarecord/chart" , //获取数据列 type : 'get', data : { }, success : function(data) { formatstringtojson(data);//对数据进行处理 } }); function formatstringtojson(data) { jsondata = json.parse(data); //把后台传来的数据转来json格式 //jsondata是二维数组,因为实体类chartseries的字段data也是个list for (x in jsondata) { //遍历json格式的数组取元素, x代表下标 for (y in jsondata[x].data) { alert(jsondata[x].occurtime[y]) ;//依次获取 alert(jsondata[x].data[y]); } } }
第三步:java代码
@responsebody @requirespermissions("datarecord:view") @requestmapping(value = "/datarecord/chart}", method = requestmethod.get) public list<chartseries> getchart(){ list<chartseries> list = new list<chartseries>(); //给list赋值 return list; // list }
后台传来的数据格式如下
以上这篇jquery ajax 方法success()后台传来的4种数据详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。
推荐阅读
-
jquery中ajax请求后台数据成功后既不执行success也不执行error的完美解决方法
-
jquery 通过ajax请求获取后台数据显示在表格上的方法
-
jQuery AJAX 方法success()后台传来的4种数据详解
-
浅析Ajax后台success传来json数据的问题
-
jquery中ajax请求后台数据成功后既不执行success也不执行error的完美解决方法
-
jQuery AJAX 方法success()后台传来的4种数据详解
-
jquery 通过ajax请求获取后台数据显示在表格上的方法
-
浅析Ajax后台success传来json数据的问题
-
jQuery中ajax请求后台返回json数据并渲染HTML的方法
-
浅析Ajax后台success传来json数据的问题