使用 ASP.NET 隐藏 HTML Div

Question

我将 ASP.NET 用于网页，以便进行一些涉及查找用户组织信息的服务器调用。 根据这些信息，我们需要隐藏或显示一个 div。 在标题中，我有一个肯定会运行的 C# 函数。 我尝试了以下几行来隐藏 div。

divID.Style.Add("display","none");

和

divID.Visible = false;

在正文中，我目前正在使用在服务器上运行并包含 ID“divID”的 asp:Panel。 无论我做什么，我都无法隐藏 div（无需手动放置样式）。 我尝试将脚本放在正文之前和之后，但没有任何区别。 任何有关执行此操作的最佳方法的建议将不胜感激。

编辑：

这是 C# 启动代码。

<script runat="server" language="C#">
  void getUserInfo(Object sender, EventArgs ev){

其余的 C# 代码无关紧要，但上面显示的相关行肯定正在运行。

HTML 部分看起来像这样。

<asp:Panel runat="server" id="divID" style="width:200px; height:130px; ">
   <div style="text-align:center">Test Data</div>
</asp:Panel>

Answer 1

C# 代码始终从服务器端编译和运行，因此除非您使用回发或回调，否则不会影响页面呈现后的状态。 如果要在客户端更改控件的可见状态，则需要在客户端使用 Javascript（可能由单击按钮触发）来显示和隐藏控件。

例如，请查看以下链接中的解决方案。 https://forums.asp.net/t/1603211.aspx?Show+hide+div+on+button+click+without+postback

<script type="text/javascript">
    function ToggleDiv(Flag) {
        if (Flag == "first") {
            document.getElementById('dvFirstDiv').style.display = 'block';
            document.getElementById('dvSecondDiv').style.display = 'none';
        }
        else {
            document.getElementById('dvFirstDiv').style.display = 'none';
            document.getElementById('dvSecondDiv').style.display = 'block';
        }
    }
</script>
<asp:Button ID="btn" runat="server" Text="Show First Div"
    OnClientClick="ToggleDiv('first');return false;" />

<asp:Button ID="Button1" runat="server" Text="Show Second Div"
OnClientClick="ToggleDiv('second');return false;" />
<br />
<div id="dvFirstDiv" style="display: none;">
    First Div
</div>
<div id="dvSecondDiv" style="display: none;">
    Second Div
</div>

Answer 2

在标题中，我有一个肯定会运行的 C# 函数。

如果您在谈论 HTML 页面标题 - 不，它绝对不会运行。 C# 代码仅在服务器端执行。

根据您的帖子，我假设我们在这里讨论的是 WebForms，并且您的 aspx 文件中有一个脚本块。 虽然这很好，但我建议将服务器端代码放入代码隐藏文件中。

因此，您需要做的就是为页面生命周期的PreRender阶段添加一个处理程序，并将用于显示/隐藏 div 的逻辑放在那里。

public void Page_Prerender(object sender, EventArgs e)
{
    divID.Visible = false;
    ' OR
    'divID.Style.Add("display","none");
}

请注意，设置 WebForms 控件的Visible属性会将该控件排除在呈现到页面之外，而设置display: none会将其呈现为 HTML，但不会显示在页面上。

Answer 3

尝试回溯代码：divID.Controls.clear(); 这对我有用。