一.rest风格传参在路径上增加参数
html代码
$.ajax({
type: 'put',
url: '/update'+updateId, // updateId是自定义id
dataType : 'json',
success: function (result) {
// 回调函数
}
})
后台接收
@ResponseBody
@PutMapping("/update/{updateId}")
private String Test(@PathVariable String updateId){
System.out.println(updateId);
return null;
}
二. 路径上使用?和&来传参
html代码
$.ajax({
type: 'put',
url: '/up?id='+1+'&updateId='+2, // id和updateId是自定义的值
dataType : 'json',
success: function (result) {
// 回调函数
}
})
后台接收
@ResponseBody
@PutMapping("/up")
private String Test(@Param("id") String id,@Param("updateId") String updateId){
System.out.println(updateId);
System.out.println(id);
return null;
}
三.使用data属性传参数
html代码
var id = "1";
var name = "张三";
$.ajax({
type:'put', // 请求方式
url:'/move // 路径
dataType:'json', // 这里是指定了参数的类型
data:{ 'id': id , 'name':name},
success: function (result) {
// 回调函数
}
})
后台接收
@ResponseBody
@PutMapping("/move")
private String Test(String id,String name){
System.out.println(name);
System.out.println(id);
return null;
}
四.传递form表单
html代码,建立一个form表单
<!-- onsubmit="return false":防止表单自己提交 -->
<form id="fm" onsubmit="return false">
请输入名字:<input name="name" value="张三"/>
请输入id:<input name="id" value="2"/>
<button href="javascript:void(0)" id="tijiao" >提交</button>
</form>
ajax代码:
$("#tijiao").click(function(){
$.ajax({
type:'put',
url:'/form',
dataType:'json',
data:$('#fm').serialize(), //根据表单里面的name属性传参数
success: function (result) {
// 回调函数
}
})
})
后台接收1
@ResponseBody
@PutMapping("/form")
private String Test(String id,String name){ // 这里的id和name对应着表单里面的name属性
System.out.println(name);
System.out.println(id);
return null;
}
后台接收2
// 推荐
@ResponseBody
@PutMapping("/form")
private String Test(TreeData treeData){
System.out.println(treeData);
return null;
}
TreeData实体类
@Data
public class TreeData {
private int id; // 里面有表单对应的id属性,所以拿实体类接收,这个id字段可以接收表单传过来的id值
private String region;
private int _parentId;
private int sortNumber;
private String text;
private List children;
private String state;
private String iconCls;
private String name; // 和上面一样
}
五.ajax传一个数组
html代码
var ids = [];
for(var i=0; i<10; i++){
ids[i] = i;
}
$.ajax({
type:'put',
url:'/array',
dataType:'json',
data:JSON.stringify(ids),
contentType:"application/json",
success: function (result) {
// 回调函数
}
})
后台接收
@ResponseBody
@PutMapping("/array")
private String Test( @RequestBody List<String> ids){
System.out.println(ids);
return null;
}
六.传一个对象数组
html代码
var list = [];
var obj = {"id":1,"name":"张三"};
var obj1 = {"id":2,"name":"李四"};
list.push(obj);
list.push(obj1);
console.log(list);
$.ajax({
type:'put',
url:'/array',
dataType:'json',
data:JSON.stringify(list),
contentType:"application/json",
success: function (result) {
// 回调函数
}
})
后台接收
// 这里有个坑,get请是接收不了的
@ResponseBody
@PutMapping("/array")
private String Test( @RequestBody List<Map<String, String>> list){
System.out.println(list);
return null;
}
更多推荐
jquery ajax传参
发布评论