如何让PHP接收通过jQuery动态新增的多行表单内容？

嘿，刚好我之前做过几乎一模一样的需求！用jQuery动态加表单字段，然后无限制提交到PHP，核心其实就一个关键点——把表单字段的名称设成数组格式，剩下的就是前端克隆和后端遍历的事儿了，给你一步步拆解：

不管用户加10个还是1000个字段，只要把输入框的name属性设成exercise[]（带方括号的数组格式），PHP就能直接以数组形式接收所有字段值，完全不用管数量上限。

1. 前端HTML初始结构 #

先搭好基础的表单框架，初始放一个锻炼项目字段组，再加个添加按钮：

<form id="workoutForm" method="POST" action="submit.php">
  <!-- 初始字段组 -->
  <div class="exercise-group">
    <input type="text" name="exercise[]" placeholder="输入锻炼项目名称" required />
    <button type="button" class="add-btn">+ 添加项目</button>
  </div>
  <br>
  <button type="submit">提交所有项目</button>
</form>

这里的name="exercise[]"是关键，别漏了方括号！

2. jQuery动态克隆字段的代码 #

用clone()方法复制现有字段组，注意要清空输入框的内容，还要用事件委托处理动态添加的按钮（不然新按钮点击没反应）：

$(document).ready(function() {
  // 点击添加按钮时克隆字段组
  $(document).on('click', '.add-btn', function() {
    // 克隆第一个字段组，同时清空输入框的内容
    const newFieldGroup = $('.exercise-group:first').clone();
    newFieldGroup.find('input').val('');
    
    // 把新字段组插入到当前按钮所在组的后面
    $(this).closest('.exercise-group').after(newFieldGroup);
  });
});

如果想加删除功能（用户肯定会需要的），可以给每个字段组加个删除按钮，补充代码：

// 给初始字段组添加删除按钮
$('.exercise-group').append('<button type="button" class="delete-btn" style="margin-left:10px;">- 删除</button>');

// 处理删除按钮点击事件
$(document).on('click', '.delete-btn', function() {
  // 至少保留一个字段组，避免用户删光
  if ($('.exercise-group').length > 1) {
    $(this).closest('.exercise-group').remove();
  } else {
    alert('至少要保留一个锻炼项目哦～');
  }
});

这样克隆出来的新字段组也会自动带上删除按钮，完美！

3. PHP后端接收并处理数据 #

前端提交后，PHP里直接用$_POST['exercise']就能拿到所有锻炼项目的数组，然后遍历处理就行（比如过滤空值、存入数据库）：

<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
  // 检查是否有提交的锻炼项目数组
  if (isset($_POST['exercise']) && is_array($_POST['exercise'])) {
    $allExercises = $_POST['exercise'];
    
    // 遍历每个项目，过滤掉空内容
    foreach ($allExercises as $index => $item) {
      $trimmedItem = trim($item);
      if (!empty($trimmedItem)) {
        echo "第 ".($index + 1)." 个锻炼项目：{$trimmedItem}<br>";
        // 这里可以写入库逻辑，比如：
        // $pdo->prepare("INSERT INTO workouts (name) VALUES (?)")->execute([$trimmedItem]);
      }
    }
  } else {
    echo "没有提交任何有效锻炼项目";
  }
}
?>

额外优化小技巧 #

• 如果每个锻炼项目还有关联字段（比如重量、次数），可以用多维数组命名，比如workouts[][name]、workouts[][weight]，这样PHP里能拿到每个项目的完整信息：

  <div class="exercise-group">
    <input type="text" name="workouts[][name]" placeholder="项目名称" />
    <input type="number" name="workouts[][weight]" placeholder="重量" />
    <input type="number" name="workouts[][sets]" placeholder="组数" />
  </div>
  

  PHP里直接遍历$_POST['workouts']就能拿到每个项目的所有属性，非常清晰。
• 前端可以加表单验证，比如提交前检查所有必填字段是否填写，避免空提交。

内容的提问来源于stack exchange，提问作者user8874282