jQuery AJAX 方法 success()后台传来的4种数据

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 = trueAjaxResponseMsg 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; //idprivate 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也是个listfor (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种数据相关推荐

查看ajax传来的数据,jQuery AJAX 方法 success()后台传来的4种数据
1.后台返回一个页面 js代码 /**(1)用$("#content-wrapper").html(data);显示页面*/ $.ajax({ async : false, cac ...
asp.net jquery.Ajax() 方法调用后台方法
利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法. 先来个简单的实例热热身吧. 1.无参数的方法调用 asp.net code: view plaincopy to clip ...
jq封装接口ajax,jquery ajax方法封装及api文件设计的代码示例
本篇文章给大家带来的内容是关于jquery ajax方法封装及api文件设计的代码示例,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 封装 jquery ajax 文件/** * 封 ...
jquery ajax html方法吗,jQuery ajax方法
jQuery AJAX 方法 jQuery load() 方法是简单强大的AJAX方法.从服务器加载数据,并将数据显示在被选中元素中. 语法: $(selector).load(URL,data,ca ...
再谈Jquery Ajax方法传递到action
之前写过一篇文章Jquery Ajax方法传值到action,本文是对该文的补充. 假设 controller中的方法是如下: public ActionResult ReadPerson(Perso ...
ajax带参数get,使用jQuery ajax方法传递GET参数
我想使用jQuery ajax方法来处理表单.在我调用的php脚本(myScript.php)中,我想使用通过在PHP脚本中提交表单设置的GET值,但它没有正确传递.使用jQuery ajax方法传递 ...
[js] ajax如何接收后台传来的图片？
[js] ajax如何接收后台传来的图片? 1.设置responseType为 Blob,2.将Blob保存为文件个人简介我是歌谣,欢迎和大家一起交流前后端知识.放弃很容易, 但坚持一定很酷.欢迎 ...
【看板】ajax动态获取后台传来json数据，加载到页面表格中
ajax动态获取后台传来json数据,加载到页面表格中摘要 1.WebApi 2.看板HTML 3.ajax获取后台传来的数据:在这里要注意声明提升,所以需要在for循环外var str1 = &q ...
jquery ajax提交表单数据的两种方式
jquery ajax提交表单数据的两种方式转载于:https://www.cnblogs.com/zhujiabin/p/4912364.html

jQuery AJAX 方法 success()后台传来的4种数据

1.后台返回一个页面

2. 后台返回一个基本类型String,Long等

3. 后台返回一个实体类

4.后台返回一个实体类list（实体类的字段都是基本类型）

5.后台返回一个实体类list（实体类的字段包括List类型）

jQuery AJAX 方法 success()后台传来的4种数据相关推荐

最新文章

热门文章