ASP.NET WebForms后台隐藏控件，JS无法获取并显示的问题求助

当你在C#后台设置btnUpdate.Visible = false时，WebForms不会把这个控件渲染到最终的HTML页面中——相当于这个元素根本不存在于前端DOM里，所以JavaScript自然找不到它，报错是必然的。

有几种可行的处理方式，按推荐程度排序：

1. 用CSS隐藏替代服务器端Visible属性 #

这是最直接的方案，后台代码不设置Visible=false，而是通过CSS让按钮隐藏：

// 后台C#代码
btnUpdate.Style["display"] = "none";

这样控件会正常渲染到HTML里，只是被CSS隐藏。前端JS要显示时，注意WebForms会自动生成客户端ID（如果控件在NamingContainer里，比如MasterPage、Panel等），所以JS里要获取正确的客户端ID：

// 前端JavaScript代码
document.getElementById('<%= btnUpdate.ClientID %>').style.display = 'block';

如果是ASP.NET 4.0及以上，还可以给按钮设置ClientIDMode="Static"，这样客户端ID就和服务器端ID一致：

<asp:Button ID="btnUpdate" runat="server" ClientIDMode="Static" />

之后JS就可以直接用document.getElementById("btnUpdate")来操作了。

2. 用容器控件包裹按钮，控制容器的可见性（不推荐） #

如果必须用服务器端Visible属性，可以把按钮放在一个服务器端Panel里，保持Panel的Visible=true，然后用CSS隐藏按钮：

<asp:Panel ID="pnlUpdate" runat="server" Visible="true">
    <asp:Button ID="btnUpdate" runat="server" Style="display:none;" />
</asp:Panel>

这样Panel会被渲染，按钮也会包含在其中，JS依然可以找到按钮元素进行显示操作。

3. 直接在后台根据条件控制显示 #

如果你的显示条件是服务器端可以判断的，那完全可以直接在后台代码里设置btnUpdate.Visible = true，不需要前端JS介入：

// 后台C#代码，根据条件判断
if (你的条件)
{
    btnUpdate.Visible = true;
}

内容的提问来源于stack exchange，提问作者Ali Haider