摘要:本篇教程介绍了jQuery教程 如何获取一个表单字段中多条数据并转化为json格式,希望阅读本篇文章以后大家有所收获,帮助大家对jQuery的理解更加深入。
本篇教程介绍了jQuery教程 如何获取一个表单字段中多条数据并转化为json格式,希望阅读本篇文章以后大家有所收获,帮助大家对jQuery的理解更加深入。
<
如图需要获取下面两个li标签里面的数据,然后传给后台;而后台接收的数据格式是json的,所以需要把两个li里面的信息转化为以下格式的。
{recieverName:小红,recieverPhone:12341234,recieverAddress:中国湖南},{recieverName:小明,recieverPhone:12345678,recieverAddress:中国上海}
代码如下:
var recieverArr = []; //全局变量
var recieverMsg = {}; //全局变量
function recieverMsgToJson(parentFormId){ //若有多个表单公用这个函数,这里需要传所属表单的ID;例如新增和修改。
$(parentFormId + ".recieverList li").each(function(m){ //遍历每个li,当前有两个li
var recieverAttributes = [];
$(this).find("span").each(function(n){ //遍历每个li下的span,而每个li下有三个span
recieverAttributes[n] = $(this).children("input").val(); //找到每个span下存放着数据的input框,并获取值存放到数组中
});
var recieverObj = { //用对象来表示数据;这时对象是{recieverName:小明,recieverPhone:12345678,recieverAddress:中国上海}
receiverName:recieverAttributes[0],
receiverPhone:recieverAttributes[1],
receiverAddress:recieverAttributes[2]
};
recieverArr.push(recieverObj);
});
}
recieverMsg = JSON.stringify(recieverArr).replace(/\[|]/g, '') //将数组转化为json格式
console.log(recieverMsg)
//{recieverName:小红,recieverPhone:12341234,recieverAddress:中国湖南},{recieverName:小明,recieverPhone:12345678,recieverAddress:中国上海}
$.ajax({
url: '',
type: 'post',
data: {
receiverInfo:recieverMsg,//收件人信息
},
traditional:true,
success: function(data){
console.log(data);
},
error: function() {
alert("新增订单失败")
}
})
本文由职坐标整理并发布,希望对同学们有所帮助。了解更多详情请关注职坐标WEB前端jQuery频道!
您输入的评论内容中包含违禁敏感词
我知道了
请输入正确的手机号码
请输入正确的验证码
您今天的短信下发次数太多了,明天再试试吧!
我们会在第一时间安排职业规划师联系您!
您也可以联系我们的职业规划师咨询:
版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
沪公网安备 31011502005948号