Question

我的页面上有一个asp:Panel元素。我能够在代码背后设置其可见性。但我还需要通过javascipt隐藏它。

我的panel定义如下：

     <asp:Panel ID="pnlUpdateDisplay" runat="server" Visible="false" style="width:500px; border-width: thick;">
        <table style="width:300px;">
            <tr>
                <td valign="middle" style="width:120px" align="center">
                <asp:Label ID="lblUpdateMessage" runat="server" style="position:absolute; left: 120px; top: 120px;"></asp:Label>
                </td>
            </tr>
        </table>      
    </asp:Panel>

当我这样做时：

   var panel = document.getElementById('pnlUpdateDisplay');
   panel.style.visibility = 'hidden';
   panel.style.display='none';

有一个错误说：“错误：无法获取属性'style'的值：object为null或undefined”

有什么建议吗？

Answer 1

将Visible=false设置为ascx / aspx中的服务器控件标记或在后面的代码中阻止控件在DOM中呈现。那么你不会在DOM中找到它们而且它不会被JavaScript访问

更好删除 Visible="false"在面板中设置并添加样式display:none。

如果你想在后面的代码中使用此代码

pnlUpdateDisplay.Style.Add(HtmlTextWriterStyle.Display,"none");

然后使用

$('#<%=pnlUpdateDisplay.ClientID %>').toggle()

Answer 2

您可以使用.toggle()在节目和隐藏之间切换：

$('#pnlUpdateDisplay').toggle();

如果您只想隐藏它，请使用.hide()

$('#pnlUpdateDisplay').hide();

如何使用javascript / jquery设置asp Panel元素可见/隐藏

2 个答案: