HTML 从表单提交数组

在本文中，我们将介绍如何使用HTML中的表单元素来提交一个数组。我们将讨论HTML表单的基本结构，展示如何使用input元素来创建输入字段，并通过示例说明如何提交包含数组的表单数据。

阅读更多：HTML 教程

HTML 表单基本结构

HTML中的表单用于收集用户的输入数据，并将其发送到服务器进行处理。一个最简单的HTML表单结构包含在<form>标签中，并有一个或多个输入字段。例如，下面的代码展示了一个包含一个输入文本字段和一个提交按钮的基本表单结构：

<form>
  <label for="name">姓名：</label>
  <input type="text" id="name" name="name">
  <br>
  <input type="submit" value="提交">
</form>

在上面的代码中，<form>标签表示一个表单，<label>标签为输入字段提供了一个可读的标签，<input>标签用于创建输入字段，其中type="text"表示文本输入字段，id属性定义了字段的唯一标识符，name属性定义了字段的名称，<br>标签用于在两个字段之间创建一个换行，最后的<input>标签的type="submit"表示一个提交按钮。

提交数组数据

要提交一个数组数据，我们可以使用HTML表单中的多个输入字段来收集数组的不同元素。我们可以通过在输入字段的name属性中使用指定的名称和索引来创建数组。例如，下面的代码展示了一个带有三个输入文本字段的表单，用于收集三个学生的成绩：

<form>
  <label for="score1">学生成绩1：</label>
  <input type="text" id="score1" name="score[0]">
  <br>
  <label for="score2">学生成绩2：</label>
  <input type="text" id="score2" name="score[1]">
  <br>
  <label for="score3">学生成绩3：</label>
  <input type="text" id="score3" name="score[2]">
  <br>
  <input type="submit" value="提交">
</form>

在上面的代码中，我们使用了score作为数组的名称，并在索引后添加了方括号。每个输入字段都有一个名称，分别是score[0]，score[1]和score[2]，从而创建了一个包含3个元素的数组。

处理提交的数组数据

一旦用户在HTML表单中输入了数据并点击了提交按钮，这些数据将被发送到服务器进行处理。服务器端可以使用各种编程语言来接收和处理这些数据。

在服务器端，可以通过获取表单数据的数组名称并逐个获取数组中的元素来处理提交的数组数据。例如，下面是一个使用PHP处理提交数组数据的示例代码：

<?php
if (_SERVER["REQUEST_METHOD"] == "POST") {scores = _POST["score"];

  foreach (scores as score) {
    echo "学生成绩：" .score . "<br>";
  }
}
?>

在上面的代码中，我们首先检查了请求方法是否为POST，以确保只有在表单提交时才执行处理代码。然后，我们使用$_POST超级全局变量从表单中获取名为score的数组数据，并使用foreach循环遍历数组中的每个元素，并输出到页面上。

总结

本文介绍了如何使用HTML表单提交一个数组。我们通过示例代码展示了如何创建包含数组元素的输入字段，并演示了如何在服务器端处理提交的数组数据。使用HTML表单，我们可以轻松地收集和处理复杂的数据结构，为用户提供更好的交互体验。希望本文对您有所帮助！