JS的Form表单转JSON格式

一、serialize()方法

格式:var data = $("#formID").serialize();

功能:将表单内容序列化成一个字符串。

注意:要使用params = decodeURIComponent(data ,true)进行解码,不然中文数据会乱码。

数据示例:Name=小明&Age=22&Sex=男

后台:获取字符串后,可以到后台进行处理数据。

代码示例:

$.ajax({
       url: "ServletSelect?action=ins",
       type: "post",
       data: $("form").serialize(),
       dataType:"json",
       success: function (data) {
           alert(data.msg);
       }
    })

二、serializeArray()方法

格式:var strdata = $("#formID").serializeArray();

功能:将表单序列化成一个JSON结构的对象。数组类型。

数据示例:(3)[{name:"Name",value:"小明"},{name:"Age",value:"22"},{name:"Sex",value:"男"}] 获取数据为 data [0].name

通过JSON.stringify()方法,将json数据转成string类型,供后台接收。

转换类型:var str=  JSON.stringify(strdata );//转换成string数据

数据示例:”[{name:"Name",value:"小明"},{name:"Age",value:"22"},{name:"Sex",value:"男"}]”

代码示例:

var arry = $("表单").serializeArray();
$.ajax({
    url: "/index/index",
    data: { jsondata: JSON.stringify(arry) },
    type:"post",
    success: function () {
        alert("success");
    }
})

三、$.param()方法

格式:$.param(personObj)

功能:可以把json格式数据序列化成字符串形式

代码示例:

var obj={a:1,b:2}
var s=$.param(obj);

会形成a=1&b=2的形式

来源:https://www.cnblogs.com/bushui/p/11731198.html
  • 2
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在前后端交互的过程中,我们经常会遇到使用表单提交数据的情况。而在前端中,这些表单数据通常以“form data”(表单数据)的形式存在,但是在后端中往往需要将其化为“json格式JavaScript Object Notation,一种轻量级的数据交换格式),以便于后续的处理操作。 表单数据通常是由键值对(key-value pairs)组成,比如: name=张三&age=22&gender=男 这个字符串中,每一个键值对之间以“&”符号进行分隔,键和值之间以“=”符号进行分隔。在JavaScript中,我们可以通过使用URLSearchParams API来将表单数据化为一个对象,代码如下: ``` const formData = new FormData(document.forms[0]); let obj = {}; for (let [key, value] of formData) { obj[key] = value; } let json = JSON.stringify(obj); ``` 这里,我们首先通过调用FormData API获取表单数据,然后遍历键值对,将其存放到一个普通的JavaScript对象中,并通过JSON.stringify()方法将其化为JSON格式的字符串。 当然,如果你使用的是jQuery库,那么可以直接使用$.serializeArray()方法来获取表单数据,并通过$.param()方法将其化为JSON格式的字符串,代码如下: ``` const formData = $("form").serializeArray(); const json = JSON.stringify($.param(formData)); ``` 不管你使用哪种方法,将表单数据化为JSON格式的字符串,都可以方便地在后端进行处理和存储。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值