如何显示或隐藏文本框取决于下拉选择

Question

当用户更改下拉列表的选择时，将根据用户的选择显示相应的文本框。假设当用户从下拉列表中选择“A”时，文本框“A”将显示，而另一个文本框将不可见。

问题是当用户在下拉列表中选择“A”时，其他两个文本框不会消失。

aspx

<asp:DropDownList ID="DropDownList1" runat="server" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">

        <asp:ListItem></asp:ListItem>

        <asp:ListItem Value="A" Text="A" />

        <asp:ListItem Value="B" Text="B" />

        <asp:ListItem Value="C" Text="C" />

</asp:DropDownList>

A <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

B <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>

C <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>

aspx.cs

protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)

{

    if (DropDownList1.SelectedItem.Text == "A")

    {

         TextBox2.Visible = false;

         TextBox3.Visible = false;

    }

}

Answer 1

将所有文本框属性设置为可见 false，然后在下拉选择更改事件中尝试。<asp:TextBox ID="TextBox1" runat="server" visible="false"></asp:TextBox>protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e){&nbsp; &nbsp; &nbsp; if (DropDownList1.SelectedItem.Text == "A")&nbsp; &nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; TextBox2.Visible = false;&nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; else&nbsp;&nbsp; &nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; TextBox2.Visible = true;&nbsp; &nbsp; &nbsp; }}

Answer 2

如果您的目标只是根据下拉选择切换文本框的可见性，您应该在页面上编写一个 JavaScript 函数，它将索引作为参数。然后它将其他文本框的索引文本框的可见性更改为 true 和 false。像这样的东西：Dropdown event:&nbsp;on-click=“return toggleText(selectedIndex);”<script>&nbsp; &nbsp; function toggleText(index) {&nbsp; &nbsp; &nbsp; &nbsp; // show or hide textbox by setting it’s style display:block or display:none respectively&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; return false; // ensures the page is not posted-back to server&nbsp; &nbsp; }</script>

Answer 3

它不起作用，因为您应该刷新页面。您应该将AutoPostBack="true"属性添加到您的DropDownList.此外，您可以使用UpdatePanel不需要刷新所有页面。在aspx中使用这个：<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager><asp:UpdatePanel ID="updatePanel1" runat="server" UpdateMode="Conditional">&nbsp; &nbsp; <ContentTemplate>&nbsp; &nbsp; &nbsp; &nbsp; <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="true" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<asp:ListItem></asp:ListItem>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<asp:ListItem Value="A" Text="A" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<asp:ListItem Value="B" Text="B" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<asp:ListItem Value="C" Text="C" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</asp:DropDownList>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>&nbsp; &nbsp; </ContentTemplate></asp:UpdatePanel>我希望它能帮助你