将值从输入标签转换为数组答案

【问题标题】：converting value from input tag to array将值从输入标签转换为数组
【发布时间】：2023-01-11 02:49:42
【问题描述】：

我想知道是否有一种方法可以将数组传递给输入标签的值属性？所以如果我有一个表格。

<form action="/some-route" method="POST">
   <input type=hidden name=someProperty />
   <button type="submitt">send</button>
</form>

那么对于名称等于 someProperty 的隐藏输入标签，有没有办法在 value 属性中存储数据数组？基本上，当我提交表单时，我希望输入标签的值以数组的形式发布数据。

我在某处读到，我可以通过将 someProperty 的值设置为 name=someProptery[] 来做到这一点。但是我认为这可能只适用于 PHP。

【问题讨论】：

HTML 中的所有数据都是字符串。 HTML 中不存在数组。您可以存储一个可以在 JavaScript 中解析为数组的 JSON 字符串。
这取决于您的后端而不是前端。数组值参数并不是真正的标准，但您的后端可能会提供一种将数组表示为参数的方法。
另外，请记住您所发布内容的 MIME 类型很重要。一个简单的 HTML 表单使用的默认值是“application/x-www-form-urlencoded”。这本身不支持数组。但是，使用某些 JavaScript，您可以将数据作为 JSON 发布，它支持数组。它仍然需要您的后端来处理您发送给它的格式。

标签： javascript html typescript

【解决方案1】：

表单输入只能包含字符串或数值，不能包含任意的 javascript 结构。

HTML 确实支持同名的多个表单输入，并将所有单独的值作为单独的参数（具有相同的名称）传递给服务器，然后可以将其解析回服务器上的数组。例如，此表单最终会调用 URL http(s)://example.com?foo=1&foo=2&foo=3：

<form method=GET>
  <input name="foo" type="hidden" value="1">
  <input name="foo" type="hidden" value="2">
  <input name="foo" type="hidden" value="3">  
  <input type="submit">
</form>

PHP 使用约定，如果输入的名称包含[]，那么它会自动为您将结果解析为一个数组；这是 PHP 特有的，但是括号没有其他含义。如果您使用其他一些服务器端语言（或使用数据客户端），那么您需要自己单独读取每个值并将它们组合成一个数组。在某些情况下，将数组转换为字符串形式（可能是 CSV 或 JSON）并将其填充到单个输入中可能更简单。

【讨论】：

【解决方案2】：

似乎您需要先将要输出的数组存储在变量中。

完成后，您应该设置“name={variable}”。然后编写一个函数，在每次按钮提交时迭代该数组。

【讨论】：