首页  >  文章  >  web前端  >  如何通过 HTML 表单数据传输 JSON 对象?

如何通过 HTML 表单数据传输 JSON 对象?

Susan Sarandon
Susan Sarandon原创
2024-10-19 12:01:30702浏览

How to Transmit a JSON Object via HTML Form Data?

通过 HTML 表单数据传输 JSON 对象

提交表单时,数据通常作为单独的表单字段发送。但是,如果您想将数据作为 JSON 对象发送,可以使用以下方法:

方法 1:FormData 数组序列化

使用 jQuery 的 serializeArray() 将表单数据转换为数组方法,然后将其字符串化为 JSON。

var formData = JSON.stringify($("#myForm").serializeArray());

方法 2:隐藏文本区域

在表单中创建一个隐藏文本区域,并将其值设置为 JSON 字符串化的表单数据。此方法允许您在表单提交后访问服务器端的数据。

<input type="hidden" name="data" value="{&quot;first_name&quot;:&quot;binchen&quot;,&quot;last_name&quot;:&quot;heris&quot;}">

服务器端解码

如果 JSON 数据作为常规表单提交的一部分传输,则它需要在服务器端进行解码。例如,在 PHP 中:

$data = json_decode($_POST['data']);

XHR 错误解决

在您的代码中,问题可能在于忽略将 Content-Type 标头显式设置为 application/json。正确的代码应该是:

xhr.setRequestHeader('Content-Type', 'application/json');

以上是如何通过 HTML 表单数据传输 JSON 对象?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn