当用户使用 ASP.NET 从 Web 窗体中的“下拉列表列表”中选择“其他”时，文本框的显示方式

本文关键字：其他 选择 用户 显示方式 文本 列表 下拉列表 Web NET 窗体 ASP | 更新日期: 2023-09-27 18:34:30

我有asp:DropDownList，我的要求是当用户从列表中选择其他时，向用户显示TextBox。但最初TextBox是隐藏的。

我在下面编写代码以在加载页面时隐藏TextBox。

txtOtherArea.Attributes.Add("style", "display:none")

但是当我尝试使用 JQuery 显示此TextBox时，什么也没发生。下面是我的JQuery代码。

$(function () {
    $("#ddlUserArea").click(function () {
        $("#txtOtherArea").fadeIn("slow");
    });
});

我也尝试使用show()而不是fadeIn("slow")但没有选择使用show()方法。

然后我尝试下面的代码来隐藏TextBox最初。

<script type="text/javascript">
        $(function () {
            $("#txtOtherArea").fadeOut(1000);
        });
    </script>

我在母版页的头部部分编写上面的代码。但什么也没发生。

我在这个论坛上阅读了其他主题和问题，但不明白可能是因为太复杂了。我是编程新手，只需要显示TextBox当用户从DropDownList中选择其他时。请帮忙。

当用户使用 ASP.NET 从 Web 窗体中的“下拉列表列表”中选择“其他”时，文本框的显示方式

不要对 id 使用魔术字符串，而要使用 asp.net 生成的ClientID作为控件：

var ddlUserArea = "<%=ddlUserArea.ClientID %>";
var txtOtherArea = "<%=txtOtherArea.ClientID %>";

对于下拉列表，您必须使用更改事件：

$("#"+ddlUserArea).change(function () {
        $("#"+txtOtherArea).fadeIn("slow");
});

由于使用的是控件的服务器端 ID，因此应使用客户端 ID，如下所示。

$(function () {
    $("#ddlUserArea").click(function () {//YOU SHOULD USE .change() instead
        $("#<%=txtOtherArea.ClientID%>").fadeIn("slow");
    });
});

更好的方法

$(function () {
    var ddl=$("#<%=ddlUserArea.ClientID%>");
    var txt=$("#<%=txtOtherArea.ClientID%>");
    ddl.change(function () {
        if(ddl.val()=="Other"){
            txt.fadeIn("slow");
        }
    });
});
相关文章：