您的位置:首页 > Web前端 > JavaScript

用ajax向后台传参的几种方式

2017-05-07 15:06 225 查看

用ajax传参的几种方式

写了个小项目,中间用ajax传参浪费了很多时间。总结一些传参的方法分享给大家。

一个参数

第一种方法

以下所有方法中本人用的JavaScript中data属性 ,你也可以直接获取value值 都可以贴个例子

<td style="display:none;" data-c="${exam.sid }">${exam.sid }</td>


//取值的时候这么写就可以了 注意括号中的值必须和-后的值一致

var sid=$(this).data("c");

url:"",

type:"get",

data:{"id":id},

success:function(data){ }


第二种方法

//取值的方法同上

url:"${basePath}/editPassword.html?no="+no


多参数的方法

赋值方法如下

<a class="addTest" href="javascript:void(0)" data-a="${exam.id }" data-b="${exam.cid }" data-c="${exam.sid }"><button class="layui-btn layui-btn-warm">录入成绩</button></a>


取值方法如下

var   id=$(this).data("a");---

var   cid=$(this).data("b");

var   sid=$(this).data("c");


传参方法

url:"/scoreAdd.html?cid="+cid+"&id="+id+"&sid="+sid


还有一种序列化方法 直接序列化成对象传递参数

body代码如图所示(注意name的值必须和对象的属性一样)

form id=”f” action=”” method=”post”>

<input type="text" name="no" value="${sm.no }" />
<input type="hidden" name="cid" value="${sm.cid}"/>

$.ajax({
url:"${basePath}/studentEdit.html",
type:"post",
dataType:"text",
data:$("#f").serialize(),
success:function(){
}

});


传递多个对象的方法

var list=[];
for(var i=0;i<'${fn:length(addScore)}';i++){
var student=new Object();
//student.sno=$(".sno").eq(i).text();
//student.sname=$(".sname").eq(i).text();
student.sud=$(".sud").eq(i).text();
student.score=$(".score").val();
student.eid=$(".eid").val();
student.sid=$(".sid").val();
student.cid=$(".cid").val();
list[i]=student;
}
console.log(JSON.stringify(list));
$.ajax({
url : "${basePath}/addScore.html",
data : {'students':JSON.stringify(list)},
type:"post",
dataType : "text",
success : function(data) {
if(data>'0'){
alert("录取成绩成功");

}else{
alert("成绩添加失败");
}
}

});


后台使用jackson 接受的 jsonobject也可以

List<AddStudentScore> list=null;
ObjectMapper om=new ObjectMapper();
System.out.println(students);

try {
list=om.readValue(students, new TypeReference<List<AddStudentScore>>() {});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  ajax javascript