1.在response.jsp编写如下代码:
<%-- Created by IntelliJ IDEA. User: Adair Date: 2020/7/2 0002 Time: 10:11 To change this template use File | Settings | File Templates. --%> <%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>返回响应</title> <script src="js/jquery.min.js"></script> <script> // 页面加载,绑定单击事件 $(function() { $("#btn").click(function () { // alert("hello btn"); // 发送ajax请求 $.ajax({ // 编写json格式,设置属性和值 url:"user/testAjax", contentType:"application/json;charset=UTF-8", data:'{"userName":"Adair","passWord":"123456","age":30}', dataType:"json", type:"post", success:function(){ // data服务器端响应的json的数据,进行解析 } }); }); }); </script> </head> <body> <button id="btn">发送ajax的请求</button> </body> </html>2.创建返回响应控制器类控制器类的代码如下:
package com.txw.controller; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestBody; import org.springframework.web.bind.annotation.RequestMapping; /** * 返回响应控制器类 * @author Adair */ @Controller @RequestMapping(value = "/user") @SuppressWarnings("all") // 注解警告信息 public class UserController { /** * 模拟异步请求响应 */ @RequestMapping("/testAjax") public void testAjax( @RequestBody String body){ System.out.println("testAjax方法执行了..."); System.out.println(body); } }3.使用TomCat运行结果如图: 4.通过浏览器访问http://localhost:8080/response.jsp结果如图所示: 5.点击“发送ajax的请求”的按钮不会跳转到如图所示的界面: 6.控制台打印结果如图所示: