2

我的 ASP.NET 页面上有以下下拉列表：

<asp:DropDownList ID="selectAttending" runat="server">
              <asp:ListItem Value="Select One...">Select One...</asp:ListItem>
              <asp:ListItem Value="Yes">Yes</asp:ListItem>
              <asp:ListItem Value="No">No</asp:ListItem>
            </asp:DropDownList>

我也有以下脚本： 

$(function (){
$("#selectAttending").change(function () { 
ToggleDropdown(); 
}); 
ToggleDropdown();  
}); 

function ToggleDropdown(){
if ($("#selectAttending").val() == "No") {
    $("#ifAttending").hide(); 
} 
else{
    $("#ifAttending").show(); 
 } 
};

如果他们参加，我想显示的 DIV 标签是：#ifAttending

我是否需要在下拉列表中添加一个属性以在更改时显示/隐藏，或者代码是否错误？

4

4 回答 4

4

问题是 selectAttending 是页面背后的 ASP 代码中使用的控件 ID，而不是 html 中下拉元素的 ID。

您必须这样做才能获取控件的客户端 ID：

$(function (){
    $("#<%=selectAttending.ClientID%>").change(function () { 
        ToggleDropdown(); 
    }); 
    ToggleDropdown();  
}); 

function ToggleDropdown(){
    if ($("#<%=selectAttending.ClientID%>").val() == "No") {
        $("#ifAttending").hide(); 
    } 
    else{
        $("#ifAttending").show(); 
    } 
 };
于 2012-04-24T17:54:10.850 回答
2

您在 .net 中，所以 jquery 中的标识符不是 #selectAttending 除非您使用 clientidmode="static" 如果不是，您的标识符将在 .net selectAttending.UniqueID

于 2012-04-24T17:55:20.663 回答
1

尽管您的代码应该可以工作，但您可以简化并尝试此代码。请注意，我正在使用 jQuerytoggle方法，该方法采用布尔参数来显示/隐藏元素。

$(function (){
   $("#selectAttending").change(function () { 
       $("#ifAttending").toggle(this.value == "Yes")
   })
   .change();//trigger the change event on page load
});
于 2012-04-24T17:52:53.487 回答
1

代码看起来差不多。我的猜测是您DropDownList在客户端上的 ID 不完全是selectAttending因为命名容器。

您可以使用 css 类名，或使用如下语法获取 ClientID：

$("#<%=selectAttending.ClientID%>")
于 2012-04-24T17:54:01.973 回答