1. 首页
  2. 问答
  3. 如何在ASP.NET中创建客户端显示/隐藏面板

如何在ASP.NET中创建客户端显示/隐藏面板

2011-11-04 44 views
1

我对ASP.NET很新颖。我需要在ASP.NET中创建一个仅包含文本的显示/隐藏面板。面板需要有滑动效果。我可以用回发做。有没有内置的控件可以做到这一点，而无需回传。如何在ASP.NET中创建客户端显示/隐藏面板

enter image description here

此外，文本 “秀” 应更改为 “隐藏” 不回发。

编辑：忘了提及我在我的应用程序中有几个这样的面板。

来源

2011-11-04 devnull

回答

0

你可以尝试这样的....

 <html xmlns="http://www.w3.org/1999/xhtml"> 
<head id="Head1" runat="server"> 
    <title>Untitled Page</title> 

    <script type="text/javascript"> 
function Show1_onclick() { 
document.getElementById('Panel1').style.display ='block'; 
document.getElementById('Panel2').style.display ='none'; 
document.getElementById('Hidden1').value = 'Panel1'; 
} 

function Show2_onclick() { 
document.getElementById('Panel1').style.display ='none'; 
document.getElementById('Panel2').style.display ='block'; 
document.getElementById('Hidden1').value = 'Panel2'; 
} 

function StartUpScript() 
{ 
    if (document.getElementById('Hidden1').value == 'Panel1') 
    { 
     document.getElementById('Panel1').style.display ='block'; 
     document.getElementById('Panel2').style.display ='none'; 
    } 
    else if (document.getElementById('Hidden1').value == 'Panel2') 
    { 
     document.getElementById('Panel1').style.display ='none'; 
     document.getElementById('Panel2').style.display ='block'; 
    } 
} 
// --> 
    </script> 

</head> 
<body onload="StartUpScript()"> 
    <form id="form1" runat="server"> 
     <div> 
      <input id="Show1" language="javascript" onclick="return Show1_onclick()" type="button" 
       value="Show1" /> 
      <input id="Show2" language="javascript" onclick="return Show2_onclick()" type="button" 
       value="Show2" /> 
      <asp:Panel ID="Panel1" runat="server" Height="50px" Width="125px"> 
       <table id="Table1"> 
        <tr> 
         <td style="width: 95px"> 
          table1<br /> 
          <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> 
          <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Click1" /> 
         </td> 
        </tr> 
       </table> 
      </asp:Panel> 
      <asp:Panel ID="Panel2" runat="server" Height="50px" Width="125px"> 
       <table id="Table2"> 
        <tr> 
         <td style="width: 99px"> 
          table2<br /> 
          <asp:Label ID="Label2" runat="server" Text="Label"></asp:Label> 
          <asp:Button ID="Button2" runat="server" OnClick="Button2_Click" Text="Click2" /> 
         </td> 
        </tr> 
       </table> 
      </asp:Panel> 
      <input id="Hidden1" runat="server" type="hidden" /> 
     </div> 
    </form> 
</body> 
</html>

来源

2011-11-04 22:02:43

+0

但我不需要重复这个页面中的所有面板？ – devnull

相关问题

 相关问题