以两种形式发布数据，第一种形式在填写第二种形式之前不会发送任何数据

Question

基本上我有两种形式。 我想让用户在注册时填写第一批信息。 按下一步（提交），然后填写第二批信息。 他们按下注册后，提交两组POST信息。

我所拥有的是-具有两种不同形式的两个部分（将其分为两种形式的原因-该网站外观的一部分）：

<section class="first">
    <header>
        <h1>Signup 1/2</h1>
    </header>
      <form id="firstForm">
          <label>First Name</label>
          <input type="text" class="input-text" value="" name="firstName" required />
          <label>Surname</label>
          <input type="text" class="input-text" value="" name="Surname" required />
          <label>Username</label>
          <input type="text" class="input-text" value="" name="Username" required />
        <input type="submit" name="firstSubmit" value="next"/>
      </form>
</section>
<section class="second">
    <header>
        <h1>Signup 2/2</h1>
    </header>
      <form name="secondForm" class="clearfix">
          <label>Your Email</label>
          <input type="email" class="input-text" value="" name="email" required />
          <label>Password</label>
          <input type="text" class="input-text" value="" name="password" required />
        <input type="submit" name="secondSubmit" value="Register" />
      </form>
</section>

因此，第二部分是隐藏的，直到用户单击下一个按钮（提交）。 我有javascript阻止它提交，并隐藏了第一部分，并使第二部分出现：

<script type="text/javascript">
$("#firstForm").bind("submit", nextForm);
function nextForm() {
    $('.first').css("display", "none");
    $('.second').css("display", "block");
    return false;
}

这可行。 然后，我的问题是让secondForm提交，但是同时发布第一和第二个信息，就像使用一个提交按钮一样，我同时提交了这两个信息。 这可能吗？ 如果是这样，怎么办？

要使用GET方法，我会去：

$("#secondForm").bind("submit", submitForm);
function submitForm() {
    document.getElementById("firstForm").submit();  
    document.getElementById("secondForm").submit();         
}

但我不想这样做，因为GET =敏感信息的好主意。

Answer 1

我将使用一种形式，但将两组输入包装在div中。 只需隐藏第一个div，然后在第一次单击按钮时显示第二个div（您将不会保留它作为提交按钮），然后在第二次单击按钮时提交整个表单。