我有两种形式,一种是显示而另一种是隐藏的。点击表格A的提交按钮,表格A应该消失,并且在其位置,表格B应该出现。
在我的代码中,单击“注册”形式的提交按钮(id =“signup-btn1”),表单“注册”应该隐藏并形成“signup2”应该显示。根据风格,它们都处于完全相同的位置。这只是切换第二种形式内容的问题。
HTML如下:
<div class="signup-form">
<form class="signup" name="sign-up" method="post" action="">
<input type="email" name="signup-email" value="" placeholder="E-mail" class="signup-email" />
<input type="password" name="signup-password" value="" placeholder="Password" />
<input type="password" name="signup-confirmpassword" value="" class="c-password" placeholder="Confirm Password" />
<input type="submit" id="signup-btn1" name="signup-btn" value="Sign up" class="signup-btn" />
</form>
<form class="signup2" name="sign-up2" method="post" action="">
<h2>Step 2</h2>
<p>Please enter your school name to complete the sign up.</p>
<input type="text" name="school-name" value="" class="school-input" placeholder="School Name" />
<input type="submit" name="complete-signup" value="Complete Sign up" class="signup-btn" />
</form>
</div>
首选使用jQuery,应该会导致代码少得多。感谢
答案 0 :(得分:2)
将每个表格放在div中,然后:
$("button").click(function(){
$("#div1").toggle();
$("#div2").toggle();
})
如果您的网页上只有2个以上表格,请继续工作:)