根据 ASP.NET 中的下拉选择显示特定列表

本文关键字:显示 选择 列表 ASP NET 根据 | 更新日期: 2023-09-27 18:37:27

我想根据下拉列表中的选择显示特定的div并隐藏其他列表。 反之亦然。

这就是我所拥有的,但我似乎无法让它工作。

<asp:DropDownList ID="DropDownList1" runat="server" onselectedindexchanged="DropDownList1_SelectedIndexChanged1">            
    <asp:ListItem Text="Fruits" Value="2014"></asp:ListItem>
    <asp:ListItem Text="Colors" Value="2013"></asp:ListItem>
</asp:DropDownList>
<div id="div2014" runat="server">
    <ul>
        <li>Apples</li>
        <li>Oranges</li>
        <li>Bananas</li>
    </ul>
</div>
<div id="div2013" runat="server">
    <ul>
        <li>Red</li>
        <li>White</li>
        <li>Blue</li>
    </ul>
</div>

我的 C# 代码是

protected void DropDownList1_SelectedIndexChanged1(object sender, EventArgs e)
{
    div2014.Visible = false;
    div2013.Visible = false;
    switch (DropDownList1.SelectedItem.Text)
    {
        case "2014":
            div2014.Visible = true;
            break;
        case "2013":
            div2013.Visible = true;
            break;
    }
}

根据 ASP.NET 中的下拉选择显示特定列表

AutoPostBack 属性添加到您的DropDownList

<asp:DropDownList ID="DropDownList1" runat="server" onselectedindexchanged="DropDownList1_SelectedIndexChanged1" AutoPostBack="True">

将后面的代码更改为以下内容:

protected void DropDownList1_SelectedIndexChanged1(object sender, EventArgs e)
{
    div2014.Visible = false;
    div2013.Visible = false;
    switch (DropDownList1.SelectedValue)
    {
        case "2014":
            div2014.Visible = true;
            break;
        case "2013":
            div2013.Visible = true;
            break;
    }
}

并且您希望在选择值之前隐藏两个div:

<div id="div2014" runat="server" Visible="false">