Ajax传值以及接受传值，@ResPonseBody和@RequestBody Ajax对于Java编程⼈员开说可是很重要的，可以说是必会的。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!--第⼀步：引⼊Jquery的地址(相当于下载js源代码，跟引⼊jar包⼀样)-->
<script src="cdn.bootcss/jquery/3.2.0/jquery.min.js"></script>
</head>
<body>
<script>
// 第⼆步：使⽤Jquery的 ajax （被封装过的）来请求数据地址
$.ajax({
type:'post',
url:'api/data.json',
data:{},
success:function (res) {
console.log(res)
}
})
// url: 填写的内容的是后台的数据接⼝
// type: 本次发送请求的⽅式 get/post
/
/ data: 后台需要前端发送请求的参数，在这⾥⽤JSON格式拼接
js获取json的key和value// success: 是ajax请求成功时，触发的函数⽅法  res就是接受到的后台返回的数据
// 第三步，在success接受后台返回的数据内容
// 跨域问题：
$.ajax({
url:'p/Ldx/Ajax_Class/zhejsonp.php',
type:'get',
data:{},
dataType:'jsonp', // JQ已经封装好了跨域请求，只需要在这加⼀⾏代码，前段就可以进⾏跨域请求，但是需要后端的⽀持
success:function (res) {
console.log(res)
}
})
</script>
</body>
</html>
看完上⾯的步骤，以及考虑到跨域问题。相信⼤家对ajax都有⼀些了解。
下⾯我们进⾏很亲民化的代码。
<%--
Created by IntelliJ IDEA.
User: mac
Date: 2018/10/26
Time: 1:57 PM
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript" src="/js/jquery.form.js"></script>    这⾥也是引⼊JQ，⽅式有很多～
<html>
<head>
<title>Title</title>
</head>
<body>
<form action="${tPath}/user/ajax.do">
id<input type="text" name="id" id="userId">
姓名<input type="text" name="name" id="username">
<%--<input type="button" value="提交" id="btn" onclick="btnAction()"> --%>
<input type="button" value="提交" onclick="btnAction()">
</form>
</body>
</html>
<script>
//    ajax的url传值形式为{"id":1,"username":"张三",}
function btnAction(){
var id = $('#userId').val();
var username = $('#username').val();
var d ={"id":id,"username":username};
// 将对象类型转成字符串
var  jsnStr = JSON.stringify(d);
$.ajax({
type:'post',
url:'${tPath}/user/ajaxTest.do',
contentType:'application/json;charset=utf-8',          这句话的作⽤也是很⼤的啊，可以把值拼在url上
data:jsnStr,
success:function (data) {
alert(data.username);
if(data.username=="⼩明"){
alert("成功")
}
}
})
};
接下来我们看⼀下后台是如何把值传回给ajax，以及接受ajax穿的值。
@ResPonseBody 和 @RequestBody 对于ajax接受值和传值可以很好的两个注解。
既然说到这两个注解，我们就来看看这两个注解的好处把。
@ResPonseBody
1、@RequestBody需要把所有请求参数作为json解析，因此，不能包含key=value这样的写法在请求url中，所有的请求参数都是⼀个json
2、直接通过浏览器输⼊url时，@RequestBody获取不到json对象，需要⽤java编程或者基于ajax的⽅法请求，将Content-Type设置为application/json
@RequestBody
1、@responseBody注解的作⽤是将controller的⽅法返回的对象通过适当的转换器转换为指定的格式之后，写⼊到response对象的body 区，通常⽤来返回JSON数据或者是XML
  2、数据，需要注意的呢，在使⽤此注解之后不会再⾛视图处理器，⽽是直接将数据写⼊到输⼊流中，他的效果等同于通过response对象输出指定格式的数据。
在做后提⼀下传值为时间格式的时候，要引⼊标签库。
<%--将date类型，转为字符串--%>
<%@ taglib prefix="fmt" uri="java.sun/jsp/jstl/fmt" %>
代码要⽤fmt阔上。
<fmt:formatDate value="${user.birthday}" pattern="YYYY-MM-dd HH:mm:ss"></fmt:formatDate>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。