首頁  >  文章  >  web前端  >  如何透過 HTML 表單資料傳輸 JSON 物件?

如何透過 HTML 表單資料傳輸 JSON 物件?

Susan Sarandon
Susan Sarandon原創
2024-10-19 12:01:30701瀏覽

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