Question

每次点击按钮时，我都需要添加一个新表单来存储图形信息。

每次我点击按钮，我都应该将Div增加1，以便新信息可以存储在具有唯一ID的数据库中。

.jumbotron{
width:1000px;
height:100px;
background-color:lightblue;
}

<form action = "" method = "post">
<input type = "submit" name = "submit" value = "Add a new form">
</form>

<div class = "jumbotron">
First Name: <input type="text" name="firstname"><br>
Last Name: <input type="text" name="lastname"><br>
</div>

请参阅此处：https://jsfiddle.net/rk6eyym6/

Answer 1

您想在点击“添加新表单”按钮时添加更多表单吗？我们可以使用Javascript实现这一点。但我将教你如何使用名为jQuery的Javascript库。

首先，下载库here。

然后，我们可以继续创建脚本。

<script src="jquery-1.9.1.min.js"></script> <!-- CHANGE THE NECESSARY FILE DEPENDING ON THE VERSION YOU HAVE DOWNLOADED -->
<script>

  $(document).ready(function(){ /* PREPARE THE SCRIPT */       
    $("#add").click(function(e){ /* WHEN ADD BUTTON IS CLICKED */
      e.preventDefault(); 
      $(".jumbotron").append('First Name: <input type="text" name="firstname[]"><br>Last Name: <input type="text" name="lastname[]"><br>'); /* APPEND TWO MORE FIELDS */
    });

  });
</script>

您可以查看此jsfiddle作为示例。

注意，您必须在输入字段的[]标记上添加name，以便在传递它们时将它们解释为数组。不这样做只会导致读取第一组数据。

PHP - 当单击按钮时，使用for循环将Form Div增加1

1 个答案: