Question

基本上我有两种形式。我希望在注册时让用户填写第一批信息。按next（提交），然后填写第二批信息。按下注册后，提交两组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;
}

这很有效。我的问题是让第二个提交，然后POST第一个和第二个信息，好像有一个提交按钮，我提交两个。这可能吗？如果是这样，怎么样？

要使用GET方法，我会去：

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

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

Answer 1

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

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

1 个答案: