0

我有打开和关闭面板的选项卡。一次可以打开多个选项卡/面板。以下是我目前的解决方案：

protected static int[] tabControls = { 0, 0 };

protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            storyPanel.Visible = true;
            hoursPanel.Visible = false;
        }
    }

/* ===== TAB CONTROLS ===== */
    protected void Tab1_Click(object sender, EventArgs e)
    {
        if (tabControls[0] == 1)
        {
            storyPanel.Visible = true;
            Tab1.CssClass = "Clicked";
            tabControls[0] = 0;
            ClientScript.RegisterStartupScript(this.GetType(), "hash", "location.hash = '#storyPostBack';", true);
        }
        else
        {
            storyPanel.Visible = false;
            Tab1.CssClass = "Initial";
            tabControls[0] = 1;
        }
    }

    protected void Tab2_Click(object sender, EventArgs e)
    {
        if (tabControls[1] == 1)
        {
            hoursPanel.Visible = true;
            Tab2.CssClass = "Clicked";
            tabControls[1] = 0;
            ClientScript.RegisterStartupScript(this.GetType(), "hash", "location.hash = '#hoursPostBack';", true);
        }
        else
        {
            hoursPanel.Visible = false;
            Tab2.CssClass = "Initial";
            tabControls[1] = 1;
            ClientScript.RegisterStartupScript(this.GetType(), "hash", "location.hash = '#storyPostBack';", true);
        }
    }

有时需要按两次选项卡才能响应并打开面板以及接收对自身的 css 更改。我不知道为什么。另外，有没有更好的方法。

编辑：

它实际上不是标签，抱歉不清楚。这是使用按钮/面板/css的选项卡的错觉：

在此处输入图像描述

服务器控制：

<table width="80%" align="center">
  <tr>
    <td>
      <asp:Button Text="Tab 1" BorderStyle="None" ID="Tab1" CssClass="Initial" runat="server"
          OnClick="Tab1_Click" />
      <asp:Button Text="Tab 2" BorderStyle="None" ID="Tab2" CssClass="Initial" runat="server"
          OnClick="Tab2_Click" />
         <asp:Panel ID="storyPanel" runat="server">
          <table style="width: 100%; border-width: 1px; border-color: #666; border-style: solid">
            <tr>
              <td>
                <h3>
                  <span>tab content here </span>
                </h3>
              </td>
            </tr>
          </table>
        </asp:Panel>
        <asp:Panel ID="hoursPanel" runat="server">
          <table style="width: 100%; border-width: 1px; border-color: #666; border-style: solid">
            <tr>
              <td>
                <h3>
                  tab 2 content here
                </h3>
              </td>
            </tr>
          </table>
        </asp:Panel>
</table>
4

1 回答 1

1

在我看来，所有选项卡的初始状态都是可见的：

protected static int[] tabControls = { 0, 0 };

但实际上，实际上只有一个标签是可见的，对吧？还是所有面板都应该同时可见？如果您的 tabControls 变量与面板的实际可见性不同步，则可能需要单击两次。一次将 tabControls 更改为不可见，然后再次将其更改回可见。要修复，只需执行以下操作：

protected static int[] tabControls = { 0, 1 };
于 2013-07-16T20:39:04.673 回答