隐藏/取消隐藏面板的JavaScript函数

JavaScript function to hide/unhide panel

本文关键字:隐藏 JavaScript 函数 取消      更新时间:2023-09-26

我在visual studio 2010下使用asp.net(c#)

我有一个面板,默认设置为隐藏(可见=false)

我需要创建一个JavaScript函数,该函数将在按钮单击时执行,以使该面板在隐藏时可见,在可见时隐藏。这应该是客户端,这是目前为止我写的代码

   <script type=text/javascript>
    function func1()
    {
    i need this code please
    }
<asp:Panel ID="ResultsPanel" runat="server">
Some controls
</asp:Panel>
<asp:button id=button1 runat=server onclick=javascript:func1()>Hide/Unhide</asp:button>

首先你需要使用OnClientClick属性而不是OnClick为你的按钮,如果该按钮不运行任何服务器端代码,你可以使用html按钮而不是asp:Button

 <input type="button" onclick="func1();" value="Hide/Unhide">

你可以使用jquery中的toggle功能来隐藏/取消隐藏面板

function func1()
{
   var mypanel = $('#<%=ResultsPanel.ClientID%>');
   mypanel.toggle();
}

试试这个:

var Panel = document.getElementById("ResultsPanel");
if (Panel.style.display == "block" || Panel.style.display == "")
{
    Panel.style.display = "none";
}
else
{
    Panel.style.display = "block";
}

如果您正在使用jQuery,您可以使用以下jQuery方法,

http://api.jquery.com/toggle/

http://api.jquery.com/hide/

http://api.jquery.com/show/