首先看下 ajax的介绍
AJAX 是一种用于创建快速动态网页的技术。
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。
基本测试
页面
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script type="text/javascript" th:src="@{/js/jquery.min.js}"></script> <script type="text/javascript"> var id= function loadXMLDoc() { console.log("1"); $.ajax({ // 1 请求方式 post或者get type : 'post', // 2 请求地址 url : '/ajax', cache : false, async : false, // 这个需要写上 dataType : 'json', // 4 回调函数 success : function(backData) {//backData相当于返回的map var aa = backData["regist"];//regist相当于map的key, 得到的aa就是 value //在这里做逻辑代码,实现具体的功能 alert("您好"); } }); }; </script> </head> <body> <button type="button" onclick="loadXMLDoc()">test</button> <input type="test" id="judge" name="judge" class="judge"/> </body> </html>
控制层
@Controller public class LmanageController { @RequestMapping("/ajax") @ResponseBody public Map ajax() { Map map=new HashMap(); map.put("regist",true); System.out.println(map); return map; } }
踩过的坑
1.async : false 这个需要写上 否则不出现数据
2.@Controller+@ResponseBody 才能实现返回map到页面
3.var aa = backData["regist"];//regist相当于map的key, 得到的aa就是 value 取值
参考的网址
1.https://blog.csdn.net/xiongdaandxiaomi/article/details/80214567?depth_1-utm_source=distribute.pc_relevant.none-task&utm_source=distribute.pc_relevant.none-task
2.https://blog.csdn.net/qq_41107231/article/details/90173339?depth_1-utm_source=distribute.pc_relevant.none-task&utm_source=distribute.pc_relevant.none-task