document.addEventListener("DOMContentLoaded", function () {
var form = document.querySelector("form");
var formContainer = document.querySelector('#container');
document.getElementById("newPlace").addEventListener("click", cloneSection);
form.addEventListener("click", function (evt) {
if (evt.target.name == "remove")
formContainer.removeChild(sectionFor(evt.target));
});
form.addEventListener("input", function (evt) {
if (evt.target.name == "uberschrift")
updateHeader(sectionFor(evt.target), evt.target.value);
});
function cloneSection(evt) {
var target = form.querySelector("#container section:first-child").cloneNode(true);
formContainer.appendChild(target);
updateHeader(target, null);
var textFields = target.querySelectorAll("input[type=text]");
for (j = 0; j < textFields.length; ++j)
textFields[j].value = '';
}
function updateHeader(section, hdrValue) {
var header = section && section.querySelector("h2 span");
if (hdrValue != null)
header.innerText = " - " + hdrValue;
else
header.innerText = "";
}
function sectionFor(control) {
while (control && control.tagName.toLowerCase() != "section")
control = control.parentNode;
return control;
}
});<form name="form1" action="index.php" method="post" autocomplete="off" enctype="multipart/form-data">
<div id="container" style="display: block;">
<section>
<h2>Place <span></span><button id="remove" type="button" name="remove">Delete</button></h2>
<label for="headline"><span>Headline:</span><input type="text" name="headline" size="80"></label>
</section>
</div>
<!--</form>-->
<button id="newPlace" type="button">New Headline</button>
<input type="hidden" name="aktion" value="save">
<button id="enter" type="submit" value="save">Submit</button>
</form>我编写了一个动态表单，您可以在其中使用按钮添加表单字段。现在我试图将它们保存到 mysql 数据库中，但它只需要生成的输入字段的最后一个值。我想通了，这是因为仍然在每个创建的字段中的名称仍然相同。我怎样才能用纯 JS 解决这个问题？我正在考虑使用类似循环的东西，然后简单地增加它。
<form name="form1" action="index.php" method="post" autocomplete="off" enctype="multipart/form-data">
<div id="container" style="display: block;">
<label for="headling"><span>Headline:</span><input type="text" name="headline" size="80"></label></div>
提前致谢！
如果您正在动态创建输入，那么您应该使用 name 作为数组，如下所示：
<input type="text" name="data[]" />
您可以将其作为数组访问服务器端（POST 方法示例）：
print_r($_POST['data']);
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句