Question

我有一个包含3个文本字段的表单：

  <form id="form1" name="form1"action="">
  <td><input name="name" type="text" id="name" /></td>
  <td><input name="address" type="text" id="address"  /></td>
  <td><input name="age" type="text" id="age" /></td>

   ///Add Button here
  </form>

如何在点击添加表单按钮时生成相同的表单？

Answer 1

您可以通过使用Add按钮触发将输出另一个表单的服务器端代码来执行该服务器端，但这意味着重新加载整个页面。

要在不重新加载的情况下执行此操作，您可以使用JavaScript .cloneNode()方法使用纯客户端代码：

<button type="button" id="btnAddForm" onclick="CloneForm('formNameHere');">Add</button>

JavaScript：

function CloneForm(formName) {
    var formCount = document.forms.length;
    var oForm = document.forms[formName];
    var clone = oForm.cloneNode(true);
    clone.name += "_" + formCount;
    document.body.appendChild(clone);
}

（必须更改表格的名称，否则我们将无法访问原始表格）

Live test case

Answer 2

javascript：

function a()
{
document.write("<form id='form1' name='form1'action=''>");
document.write(" <td><input name='name' type='text' id='name'/></td>");
 document.write("<td><input name='address' type='text' id='address'/></td>");

文件撰写（ “”）;

HTML：

<input type="button" value="form" onclick="a();">

我认为这就是你所期待的。如果没有，请说清楚。我会尽力帮助你。

单击按钮时如何使用文本字段创建表单

2 个答案: