亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何使用html表單數據發送JSON對象

如何使用html表單數據發送JSON對象

Qyouu 2019-08-12 14:36:09
如何使用html表單數據發送JSON對象所以我有這個HTML表單:<html><head><title>test</title></head><body>     <form action="myurl" method="POST" name="myForm">         <p><label for="first_name">First Name:</label>         <input type="text" name="first_name" id="fname"></p>         <p><label for="last_name">Last Name:</label>         <input type="text" name="last_name" id="lname"></p>         <input value="Submit" type="submit" onclick="submitform()">     </form></body></html>當用戶點擊提交時,這是將此表單的數據作為JSON對象發送到我的服務器的最簡單方法?更新:我已經走了這么遠,但它似乎不起作用:<script type="text/javascript">     function submitform(){         alert("Sending Json");         var xhr = new XMLHttpRequest();         xhr.open(form.method, form.action, true);         xhr.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');         var j = {             "first_name":"binchen",             "last_name":"heris",         };         xhr.send(JSON.stringify(j));我究竟做錯了什么?
查看完整描述

3 回答

?
holdtom

TA貢獻1805條經驗 獲得超10個贊

獲取完整的表單數據作為數組和json字符串化它。

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

您可以稍后在ajax中使用它?;蛘呷绻銢]有使用ajax; 把它放在隱藏的textarea中并傳遞給服務器。如果此數據通過普通表單數據作為json字符串傳遞,則必須使用json_decode對其進行解碼 。然后,您將獲得數組中的所有數據。

$.ajax({
  type: "POST",
  url: "serverUrl",
  data: formData,
  success: function(){},
  dataType: "json",
  contentType : "application/json"});


查看完整回答
反對 回復 2019-08-12
?
墨色風雨

TA貢獻1853條經驗 獲得超6個贊

HTML無法從表單數據生成JSON。

如果你真的想從客戶端處理它,那么你將不得不求助于使用JavaScript:

  1. 通過DOM從表單中收集數據

  2. 將它組織在一個對象或數組中

  3. 使用JSON.stringify生成JSON

  4. 使用XMLHttpRequest發布

你可能最好不要堅持application/x-www-form-urlencoded使用服務器而不是JSON處理數據和處理數據。您的表單沒有任何可以從JSON數據結構中受益的復雜層次結構。


更新以回應重大改寫的問題......

  • 你的JS沒有readystatechange處理程序,因此你對響應沒有任何作用

  • 單擊提交按鈕時觸發JS而不取消默認行為。一旦JS功能完成,瀏覽器將以常規方式提交表單。


查看完整回答
反對 回復 2019-08-12
?
繁花如伊

TA貢獻2012條經驗 獲得超12個贊

您的代碼很好但從未執行過,提交按鈕的原因[type =“submit”]只需用type = button替換它

<input value="Submit" type="button" onclick="submitform()">

在你的腳本里面; 表單未聲明。

let form = document.forms[0];xhr.open(form.method, form.action, true);


查看完整回答
反對 回復 2019-08-12
  • 3 回答
  • 0 關注
  • 2993 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號