Question

我希望有一个HTML表单，在Http请求正文中发布以下内容。

{ “info” : {
     “id” : “123”
     “text1” : <comes from html text-box>
}

所以，我想要的是将上面的内容表示为JavaScript对象，然后在提交时发布此JavaScript对象。 “text1”的值将来自用户输入，这将是一个html格式的textarea输入框。第一个值“id”将是硬编码的，或者也可能来自隐藏的文本框。

所以我的问题是：如何编写一段JavaScript来实现这一点，以及相应的html表单等。

Answer 1

<html>
 <head>
  <script>
   function sendJson()
   {
   var x=document.forms["alfa"]["text1"].value;
   str1="{ 'info' : { 'id' : '123' 'text1' : ";
   str2=str1.concat(x);
   body=str2.concat(" }");
   document.forms["alfa"]["text1"].value=body;
   }
  </script>
 </head>
 <body>
  <form id="alfa" onsubmit="return sendJson()">
   Text1: <input id="text1" type=text size=50>
   <input type="submit" value="Submit">
  </form>
 </body>
</html>

Answer 2

使用jQuery最容易做到这一点。

首先，使用您的数据初始化JavaScript对象。然后，使用jQuery从文本框中提取文本并将其分配给对象中的所需属性。

var data = { 
    "info": {
        "id":"123",
        "text1":"" 
    }
};

data.info.text1 = $("#yourTextBox").val();

然后你可以使用jQuery.ajax发出请求：

$.ajax({
  type: "POST",
  url: url,
  data: data,
  success: success,
  dataType: dataType
});

请参阅jQuery文档以了解帖子： http://api.jquery.com/jQuery.post/

编辑：使用内联javascript，您的HTML看起来像这样（不使用jQuery来获取表单数据）：

<html>
<head>
<script>
var data = { 
    "info": {
        "id":"123",
        "text1":"" 
    }
};
function makeRequest()
{
    data.info.text1 = document.forms["frm1"]["fname"].value;

    $.ajax({
        type: "POST",
        url: url,
        data: data,
        success: success,
        dataType: dataType
    });
}
</script>
</head>
<body>

<form name="frm1" id="yourTextBox" onsubmit="makeRequest()">
<input type="text" name="fname">
<input type="submit" value="Submit">
</form>

</body>
</html>

Answer 3

最好的方法是使用 JSON.parse（）

从HTML表单textarea值和Post发布JavaScript中的JSON？

3 个答案: