当其他 div 可见时隐藏 div答案

【问题标题】：Hiding Div on when other div gets visible当其他 div 可见时隐藏 div
【发布时间】：2009-07-22 08:03:28
【问题描述】：

我的 aspx 页面中有以下代码：

<div id="FormContainer">
                <div id="leftSection">
                    <h1>
                        Contact Us</h1>
                    <div id="intro">
                        <p>
                            Contact PLI</p>
                        <p>
                            &nbsp;</p>
                    </div>
                    <esp:contactus id="ContactUs" runat="server" />
                </div>
</div>

下面给出了一些来自我上面的用户控件（esp:contactus）的代码

    <div id="divMain" runat="server">
        <div class="leftColumn">
        <span id="ContactUs_lblFirstName" class="details">First name:<span class="asterisk" title="This field is mandatory">*</span></span>
        <input name="ContactUs$txtFirstname" type="text" maxlength="50" id="ContactUs_txtFirstname" />
        <span id="ContactUs_rfvFirstName" style="color:Red;visibility:hidden;">Please type your forename here</span>
        <span id="ContactUs_lblFamilyName" class="details">Family name:<span class="asterisk" title="This field is mandatory">*</span></span>
        <input name="ContactUs$txtFamilyName" type="text" maxlength="50" id="ContactUs_txtFamilyName" />
        <span id="ContactUs_rfvFamilyName" style="color:Red;visibility:hidden;">Please type your family name here</span>

        <span id="ContactUs_lblAddress1" class="details">Address 1<span class="asterisk" title="This field is mandatory">*</span></span>
        <input name="ContactUs$txtAddress1" type="text" maxlength="50" id="ContactUs_txtAddress1" />
        <span id="ContactUs_rfvAddress1" style="color:Red;visibility:hidden;">Please enter the first line of your address</span>
        <span id="ContactUs_lblAddress2" class="details">Address 2</span>
        <input name="ContactUs$txtAddress2" type="text" maxlength="50" id="ContactUs_txtAddress2" />

<asp:button id="btnSubmit" cssclass="submitBTN" text="Submit"
                onclick="Submit_Click" runat="server" />
        </div>
    </div>

<div id="divThanksmsg" runat="server">
        Thank you for your enquiry.
    </div>

如果您在我的用户控件中看到提交按钮，则在验证所有上述字段后，它会显示感谢 div (divThanksmsg)。

当用户单击提交按钮时，它会在验证字段后验证所有表单，我的谢谢 div (divThanksmsg) 变得可见。但是，如果您在我的 aspx 页面中看到上面带有 id (intro) 的 div，它每次都可见。我希望这个 div 在我的ThankYou div 可见时隐藏起来。

请推荐！

【问题讨论】：

你能粘贴一下你目前有的脚本吗？
没有写javascript，所有代码都写在我的ascx.cs文件中。我的意思是它是服务器端代码

标签： .net javascript jquery

【解决方案1】：

我看到您将 div（divTanksmsg 和 divMain）都标记为在服务器上运行。您可以通过将标记修改为

来初始化 divThanksmsg 以首先隐藏

<div id="divThanksmsg" visible="false" runat="server">

完成验证后，您可以执行以下操作：

divThanksmsg.Visible = true;
divMain.Visible = false;

【讨论】：

如果你看到我的介绍 div 在 divMain 上方。我的介绍 div 在 aspx 中，而 divMain 在 usercontrol 中

【解决方案2】：

如果我理解正确，您想在显示“divThanksmsg”时隐藏“intro”div。为此，您需要在“intro”-div 上添加一个“runat=server”，然后通过代码中的这一行：divThanksmsg.Visible = true;，您需要添加 intro.Visible = false;。

【讨论】：

我的介绍 div 在 aspx 页面中。如何在我的用户控件代码中找到它的 ID。
那么如何切换 divThanksmsg 的可见性？
我在我的 ascx.cs 代码中检查页面有效条件，如果页面有效，我执行 divMain.Visible = false; divThanksmsg.Visible = true;

【解决方案3】：

您是否考虑过使用 javascript 来隐藏介绍信息？执行验证后只需注入一点。也许存储一个标志，以便您知道何时应该重新添加或删除该 js。

不过，老实说，这听起来像是在经过深思熟虑的设计中不应该出现的情况。

【讨论】：