使用 Javascript/jQuery 添加的动态表单元素未发布答案

【问题标题】：Dynamic form elements added with Javascript/jQuery not being POSTed使用 Javascript/jQuery 添加的动态表单元素未发布
【发布时间】：2012-02-20 00:17:43
【问题描述】：

我阅读了很多关于这个主题的讨论。（包括“Submit form input fields added with javascript”最终让我走上了正轨。）但是，他们都没有完全回答这个问题或解决我的问题，所以我想我会发布我的解决方案。

我正在尝试使用 jQuery 将额外的文本输入字段动态添加到表单中，并找到以下代码：

jQuery("#form_table").append(
'<tr><th>'+
'<label><b>Date: </b></label></th><td>'+
'<input type="text" id="extra_date'+counter+'" />'+
'<label><b>Time: </b></label>'+
'<input type="text" id="extra_time'+counter+'" /></td></tr>');

文本字段已添加到表单中的表格中，当我使用 firebug 调查 DOM 时，它们就在那里。但是，当我提交表单时，变量 extra_date1/extra_time1 不在 $_POST 数组中。我发现这段代码没有将元素添加到 FORM 本身。上面的帖子使用 JS 而不是 jQuery 为我指明了正确的方向。我尝试按照他们在那篇文章中提到的那样发布到表格，但这没有用。最终，这段代码对我有用：

var theForm = document.getElementById("form_table");
var newOption = document.createElement("input");
newOption.name = "extra_date"+counter;
newOption.type = "text";
theForm.appendChild(newOption);
var newOption = document.createElement("input");
newOption.name = "extra_time"+counter;
newOption.type = "text";
theForm.appendChild(newOption);

form_table 元素是表单标签内的表格标签。与上面帖子中的代码不同，我发现您不能只将其附加到表单元素本身。它必须是表单中的一个元素。

我知道这看起来很简单，但看起来网上很多人都遇到了同样的问题，所以我希望这对于像我一样拔头发的人来说是一个简明的答案。

【问题讨论】：

标签： javascript jquery forms submit

【解决方案1】：

你的代码只有 id="" 没有 name="" 你应该有 name="" 这就是发布的内容。 .

改用此代码：

jQuery("#form_table").append(
'<tr><th>'+
'<label><b>Date: </b></label></th><td>'+
'<input type="text" name="extra_date'+counter+'" />'+
'<label><b>Time: </b></label>'+
'<input type="text" name="extra_time'+counter+'" /></td></tr>');

【讨论】：