当使用 ASP.NET 的网络表单中来自 DropDownList 的其他用户 select 时如何显示 TextBox

Question

我有 asp:DropDownList，我的要求是向用户显示 select 列表中的其他用户 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>

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

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

Answer 1

因为您正在使用控件的服务器端 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");
        }
    });
});

Answer 2

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

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

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

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

当使用 ASP.NET 的网络表单中来自 DropDownList 的其他用户 select 时如何显示 TextBox

How TextBox is shown when user select other from DropDownList in web forms using ASP.NET

javascript

c#

asp.net

jquery

webforms