Question

我试图在表单中添加一些输入行，这样我就可以在一个请求中将它们发布到后端，并且如果需要，还可以添加更多相同的信息类型这是我正在使用的代码：

<!DOCTYPE html>
<head>
</head>
<body>
  <form action="#" method="post">
    <input id="firstElement" type="text" name="firstElement" value="">
    <button onClick="addRow()">add row</button><br>
    <div id="container"></div>
    <input type="submit" value="submit">
  </form>

  <script>
    function addRow() {
        var container = document.getElementById("container");
        var myElement1 = document.getElementById("firstElement").value;

        document.getElementById("firstElement").value = "";

        var i = 0;

        var input1 = document.createElement("input");
        input1.type = "text";
        input1.name= "myElement1"+ i;
        input1.disabled = "true";
        input1.value = myElement1;
        container.appendChild(input1);
        container.appendChild(document.createElement("br"));
        i++;
        }
  </script>
</body>

此代码显示输出一秒或更少，然后没有...

Answer 1

按钮元素的默认type属性为submit，因此当您点击按钮时，您实际上是在提交表单。通过将type指定为button代替：

，轻松更改

<button onClick="addRow()" type="button">add row</button>

<强> jsFiddle example

创建输入元素并使用js脚本填充它们

1 个答案: