html表单输入 - 每个输入字段的多个答案

Question

我不确定如何说出这个问题，但我会尽我所能。 我有一个从用户那里收集关于就业历史数据的表单。此刻我的形式如下：

<form name="EmploymentHistory" action="Form E.php" method="post"> 

    <h2>Employment History</h2> 
     <label>Last/Current employer</label> 
     <input type='text' name='LastCurrentemployer'> 
<hr> <label>Position</label> 
     <input type='text' name='Position'> 
<hr> <label>Date Started</label> 
     <input type='text' name='DateStarted'> 
<hr> <label>Date Finished</label> 
     <input type='text' name ='DateFinished'> 
<hr> <label>Supervised by</label> 
     <input type='text' name = 'Supervisedby'> 
<hr> <label>Contact Details for Boss</label> 
     <input type='text' name='ContactDetailsForBoss'> 

<hr> <button type='button'>Add another job</button> <br> 
<hr> <input type="submit" value="Next"> 
    </form> 

我的问题是，“添加另一个职位”按钮，什么也不做。
如何让用户在他们的工作经历中输入多个工作，以便每个工作都作为新记录输入到我的数据库中，但是提交按钮（下一个）只需要点击一次？

我在想试图然后使用arraypush添加的每个条目，比如设置一个数组：

$pastemployers = array(); 
arraypush $pastemployers(POST_['LastCurrentemployer']); 

然后循环到每一个添加为一个新的记录，如：

for ($x = 0; $x < count(pastemployers); $x++){ 
echo "<input name='pastemployers" . $x . "' value='" . $pastemployers[$x] . "'> </input>"; 

我相信有更好的方法来做到这一点，但我无法在网上找到答案或解决。我的大部分搜索都会返回关于复选框或多个提交按钮的结果（对我没有帮助）。请帮助

Answer 1

首先改变你的表格，并使用addAnotherJob（）来创建第一个span（使用jQuery）的克隆并改变每个表单字段的id。在提交这个表单的时候，你会得到一系列雇主信息。

<form name="EmploymentHistory" action="Form.php" method="post"> 

    <h2>Employment History</h2> 
    <span class="span_clone"> 
     <label>Last/Current employer</label> 
     <input type='text' id='LastCurrentemployer_0' name='LastCurrentemployer[]'> 
<hr> <label>Position</label> 
     <input type='text' id='Position_0' name='Position[]'> 
<hr> <label>Date Started</label> 
     <input type='text' id="DateStarted_0" name='DateStarted[]'> 
<hr> <label>Date Finished</label> 
     <input type='text' id='DateFinished_0' name ='DateFinished[]'> 
<hr> <label>Supervised by</label> 
     <input type='text' id='Supervisedby_0' name = 'Supervisedby[]'> 
<hr> <label>Contact Details for Boss</label> 
     <input type='text' id='ContactDetailsForBoss_0' name='ContactDetailsForBoss[]'> 


<hr> <button id='add-another-job-0' type='button' onclick= 'addAnotherJob()'>Add another job</button> <br> 
</span> 
<hr> <input type="submit" value="Next"> 
    </form> 

请参考以下链接：http://jsfiddle.net/ambiguous/LAECx/