Question

我的代码我想要隐藏具有id selnumber的div（当我选择表格60/61并显示文本消息“它是表格60/61”在div的地方）但是当选择pan然后显示div

<div id="selpan"> 
                <asp:DropDownList ID="ddlpan" runat="server">
                    <asp:ListItem>---Select---</asp:ListItem>
                    <asp:ListItem>PAN</asp:ListItem>
                    <asp:ListItem>FORM 60/61</asp:ListItem>
                </asp:DropDownList> </div>
                </td><div id="selnumber">
                <td colspan="3">&nbsp;&nbsp;&nbsp;&nbsp; 
                <asp:Label ID="add_no" runat="server" Font-Bold="True" Font-Names="Verdana" 
                        Font-Size="10pt" Font-Strikeout="False" Text="File Number"></asp:Label>
                   </td><td> 
                <asp:TextBox ID="tbnumber" runat="server" ontextchanged="tbnumber_TextChanged"></asp:TextBox>
                </td>
                </div>

Answer 1

你可以在下拉列表中添加onchange事件，虽然javascript你可以检查表单中的选定项目是否为60/61，然后隐藏div，否则显示div。

Answer 2

<div id="selpan"> 
            <asp:DropDownList AutoPostBack="true" ID="ddlpan" runat="server" onselectedindexchanged="ddlpan_SelectedIndexChanged">
                <asp:ListItem>---Select---</asp:ListItem>
                <asp:ListItem>PAN</asp:ListItem>
                <asp:ListItem>FORM 60/61</asp:ListItem>
            </asp:DropDownList> </div>

<asp:Label Visible="false" ID="lblMessage" runat="server" Font-Bold="True" Font-Names="Verdana" Font-Size="10pt" Font-Strikeout="False" Text="File Number"></asp:Label>
        <div id="selnumber" Visible="false" runat="server">              
            <asp:Label ID="add_no" runat="server" Font-Bold="True" Font-Names="Verdana"  Font-Size="10pt" Font-Strikeout="False" Text="File Number"></asp:Label>
            <asp:TextBox ID="tbnumber" runat="server" ontextchanged="tbnumber_TextChanged"></asp:TextBox>
         </div>

.....

  protected void ddlpan_SelectedIndexChanged(object sender, EventArgs e)
{
    if (ddlpan.SelectedIndex == 1)
    {
        selnumber.Visible = true;
        lblMessage.Visible = false;

    }
    else if (ddlpan.SelectedIndex == 2)
    {
        selnumber.Visible = false;
        lblMessage.Visible = true;
        lblMessage.Text = "It is form 60/61";
    }
}

Answer 3

有两种方法可以做到这一点。

您可以使用 onSelectedIndexChanged（）这样的事件，比如@Sruthi已经说过，但这会包含对服务器的不必要调用并花费时间。

第二种更好的方法是使用javascript onchange（）事件并节省时间和资源。

Javascript代码。

<script type="text/javascript">
        function change() {
            var DropdownList = document.getElementById('<%=ddlpan.ClientID %>');
            var SelectedIndex = DropdownList.selectedIndex;
            var message = document.getElementById('message');
            var selnumber = document.getElementById('selnumber');

            if (SelectedIndex == 2) {
                selnumber.style.display = "none";
                message.style.display = "block";
            }
            else {
                selnumber.style.display = "block";
                message.style.display = "none";
            }
        }
    </script>

ASP.NET代码..

<div id="selpan"> 
            <asp:DropDownList ID="ddlpan" runat="server" onchange="change()">

                <asp:ListItem>---Select---</asp:ListItem>
                <asp:ListItem>PAN</asp:ListItem>
                <asp:ListItem>FORM 60/61</asp:ListItem>
            </asp:DropDownList> 
            <asp:Label ID="label" runat="server"></asp:Label></div>
            </td><div id="selnumber" style="">
            <td colspan="3">&nbsp;&nbsp;&nbsp;&nbsp; 
            <asp:Label ID="add_no" runat="server" Font-Bold="True" Font-Names="Verdana" 
                    Font-Size="10pt" Font-Strikeout="False" Text="File Number"></asp:Label>
               </td><td> 
            <asp:TextBox ID="tbnumber" runat="server" ></asp:TextBox>
            </td>
            </div>
            <div id="message" style="display:none">
            <label>This is form 60/61</label>
            </div>

在asp.net中显示/隐藏带有下拉值的div

3 个答案: