springBoot+ajax

前台

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
<script th:src="@{/jquery-3.3.1.js}"></script>
<script>
	$(function(){
		$("#button").click(function(){
			var mYnum=$("#num").val()
			var mYage=$("#age").val()
			var mYpeer=$("#peer").val()
			$.ajax({
				type:"post",
				url:"/testajax",
				data:{num:mYnum,age:mYage,peer:mYpeer},
				dataType:'json',//dataType:"json",使得返回来的数据格式为json 如果不 添加该条属性，则返回来的为字符串
				success:function(data){
					console.log(data["num"]) //取值可以.key值
					console.log(data["age"]) //取值可以.key值
					console.log(data["peer"]) //取值可以.key值
				},
				error:function(data){
					console.log("error")
					console.log(data)
				}
			})
			
		})
		
	})
</script>
</head>
<body>
	<h1>欢迎</h1>
	<hr>
	<br>
	<form>
		num<input type="text" id="num"/><br>
		age<input type="text" id="age"/><br>
		peer<input type="text" id="peer"/><br>
		<input type="button" value="提交" id="button"/>
	</form>
</body>
</html>

后台

package test.controller;
import java.util.HashMap;
import java.util.Map;

import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;

import net.sf.json.JSONObject;

@RestController
public class AjaxController {

	@RequestMapping(value="/testajax",method=RequestMethod.POST)
	public JSONObject testAjax(@RequestParam("num") String num,@RequestParam("age") String age,@RequestParam("peer") String peer) {
		Map<String,String> map=new HashMap<String, String>();
		map.put("num", "AA "+num);
		map.put("age", "BB "+age);
		map.put("peer", "CC "+peer);
		JSONObject json=JSONObject.fromObject(map);
		System.out.println(json.toString());
		return json;
	}
}

猜你喜欢