C# 服务器上运行的多个表单使客户端asp.net可见

我已经在一个单独的aspx页面上制作了注册表单、忘记密码和登录表单。我使用css来设计整个表单的样式。我使用3个表单标签。以下是代码：

ASMX

我在Toggling类别中使用了以下Js： JS

这是我的css

---

在任何情况下，我都必须使用多种形式。。有人能帮忙吗？？？

帮什么忙？问题是什么？如何使其他表单内容可见？当我切换这些表单id时，您的标记和CSS几乎无法修复。您正在向窗体的某些父级添加一个隐藏类。您可以显示表单，但它不会覆盖父类。如果您可以清理一些嵌套并去掉隐藏类，那么您将朝着正确的方向前进。是否有必要使此可见属性为真？？使用jquery或javascriptNo，您不需要这样做。

<form id="form1" runat="server" visible="true">
<ul>
<li>
   <asp:TextBox ID="email" runat="server" TextMode="email" placeholder="Email" OnTextChanged="email_TextChanged"></asp:TextBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="email" Display="Dynamic" ErrorMessage="RequiredFieldValidator">*Requied</asp:RequiredFieldValidator>

</li>
<li>
                       <asp:TextBox ID="password"  runat="server" TextMode="Password" placeholder="Password" OnTextChanged="password_TextChanged"></asp:TextBox>
                        <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="password" Display="Dynamic" ErrorMessage="RequiredFieldValidator">*Requied</asp:RequiredFieldValidator>

                    </li>
<li>
    <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />

 </li>
<li>
    <asp:Label ID="Invalid" runat="server" Text="Invalid  Username or Password" Visible="False" ></asp:Label>
     <asp:Label ID="Try" runat="server" Text="You  can't  try again ,Register Your Self" Visible="False"></asp:Label>
</li>


</ul>
</form>

  <form runat="server" id="form2" visible="false">  

               <ul>
                    <li>

  <asp:TextBox ID="username" runat="server" MaxLength="15" placeholder="UserName" OnTextChanged="username_TextChanged"></asp:TextBox>
   <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="username" ErrorMessage="RequiredFieldValidator" ForeColor="Red">*Please Input user name</asp:RequiredFieldValidator>
   <asp:Label ID="userchk" runat="server" ForeColor="Red"></asp:Label>
  </li>
                    <li>
                        <asp:TextBox ID="EmailR"  runat="server" placeholder="Email (must be valid)" OnTextChanged="EmailR_TextChanged"></asp:TextBox>

                <asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ControlToValidate="EmailR" ErrorMessage="RequiredFieldValidator" ForeColor="Red">*Please Input email</asp:RequiredFieldValidator>

                <asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" ControlToValidate="EmailR" Display="Dynamic" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" ErrorMessage="RegularExpressionValidator" ForeColor="Red">Input Valid Email</asp:RegularExpressionValidator>

                    </li>
                    <li>
                        <asp:TextBox ID="FirstName" runat="server" placeholder="FirstName" MaxLength="15" OnTextChanged="FirstName_TextChanged"></asp:TextBox>

                <asp:RequiredFieldValidator ID="RequiredFieldValidator8" runat="server" ControlToValidate="FirstName" ErrorMessage="RequiredFieldValidator" ForeColor="Red">*Please Input first name</asp:RequiredFieldValidator>
           <asp:Label ID="chkemail" runat="server" ForeColor="Red"></asp:Label> 
                    </li>

                    <li>
                        <asp:TextBox ID="LastName" runat="server" placeholder="Lastname" MaxLength="15" OnTextChanged="TextBox3_TextChanged"></asp:TextBox>

                <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ControlToValidate="LastName" ErrorMessage="RequiredFieldValidator" ForeColor="Red">*Please Input Last name</asp:RequiredFieldValidator>


                    </li>
                    <li>
  <asp:TextBox ID="Pass" runat="server" placeholder="Password" TextMode="Password" MaxLength="15" OnTextChanged="Pass_TextChanged"></asp:TextBox>

                <asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ControlToValidate="Pass" Display="Dynamic" ErrorMessage="RequiredFieldValidator" ForeColor="Red">*Please Input password</asp:RequiredFieldValidator>

                    </li>
                    <li>
               <asp:TextBox ID="Cpass" runat="server" placeholder="Confirm Password" TextMode="Password" MaxLength="15" OnTextChanged="Cpass_TextChanged"></asp:TextBox>


                <asp:RequiredFieldValidator ID="RequiredFieldValidator7" runat="server" ControlToValidate="Cpass" ErrorMessage="RequiredFieldValidator" ForeColor="Red">*Please Enter the Confirm Password  </asp:RequiredFieldValidator>

 </ul>                 
  </form> 

        <form runat="server" visible="false" id="form3">
            <ul>
                <li>
                 <asp:TextBox ID="SendEmail" runat="server"  TextMode="Email" placeholder="Enter Email" OnTextChanged="SendEmail_TextChanged"></asp:TextBox>
                 <asp:RequiredFieldValidator ID="RequiredFieldValidator11" runat="server" ControlToValidate="SendEmail" Display="Dynamic" ErrorMessage="RequiredFieldValidator">*Requied</asp:RequiredFieldValidator>

                </li>

                <li>
                    <asp:Button runat="server" text="Send email" OnClick="SendMail_Click" CssClass="button" Visible="true"   CausesValidation="False"/>
                </li>
                <li>
                    <asp:Label ID="ml" runat="server" Text="Email sended Sucessfully" Visible="False"></asp:Label>
                   <asp:Label ID="ml0" runat="server" Text="Email Didn't Match " Visible="False"></asp:Label>

                </li>
                </ul>

               </form>

    <script>

    $(document).ready(function () {
        $("#list1").click(function () {
            $("#form1").fadeIn("slow");
            $("#form2").css("display", "none");
            $("#form3").css("display", "none");
        });
        $("#list2").click(function () {
            $("#form2").fadeIn("slow");
            $("#form2").css("visible", "true");
            $("#form1").css("display", "none");
            $("#form3").css("display", "none");
        });
        $("#list3").click(function () {
            $("#form3").fadeIn("slow");
            $("#form3").css("visible", "true");
            $("#form2").css("display", "none");
            $("#form1").css("display", "none");
        });
    });
</script>