Question

我有以下代码：

<script>
    $(document).ready(function () {
       $("#rbnDoesFatherLiveWithChildNo").change(function () {
        $("FatherAddress").show();
    });
   });
</script>

HTML

<div id="FatherAddress" style="display:none">
    <div class="formQuestion">
        <asp:Label ID="lblFatherStreetDescription" runat="server" Text="Street Name & Number" CssClass="formLabel"></asp:Label>
        <asp:TextBox ID="txtFatherStreetDescription" runat="server" CssClass="formTextBox"></asp:TextBox>

    </div>
    <div class="formQuestion">
        <asp:Label ID="lblFatherTown" runat="server" Text="Town" CssClass="formLabel"></asp:Label>
        <asp:TextBox ID="txtFatherTown" runat="server" CssClass="formTextBox"></asp:TextBox>

    </div>
    <div class="formQuestion">
        <asp:Label ID="lblFatherPostCode" runat="server" Text="Postcode" CssClass="formLabel"></asp:Label>
        <asp:TextBox ID="txtFaterPostCode" runat="server" CssClass="formTextBox"></asp:TextBox>

    </div>
    <div class="formQuestion">
        <asp:Label ID="lblFatherCountry" runat="server" Text="Country" CssClass="formLabel"></asp:Label>
        <asp:DropDownList ID="drpFatherCountry" runat="server" CssClass="formDrpBox"></asp:DropDownList>

        </div>
    </div>

我不明白为什么这不起作用？

Answer 1

选择器出错。 ID应以#

开头

$(document).ready(function () {
       $("#rbnDoesFatherLiveWithChildNo").change(function () {
        $("#FatherAddress").show();
    });
   });

Answer 2

错误在于：

    $("FatherAddress").show();

应该是

    $("#FatherAddress").show();

Answer 3

您正在使用 ASP.Net 生成的元素ID将不同，因此您应该使用Control.ClientID，它会获取由ASP.NET生成的HTML标记的控件ID。

除此之外，FatherAddress应为#FatherAddress

将您的代码更改为

$(document).ready(function () {
    $("#<%=rbnDoesFatherLiveWithChildNo.ClientID%>").change(function () {
        $("#FatherAddress").show();
    });
});

Answer 4

Thnx的帮助，以另一种方式解决了：

<script>


function showDiv(thediv)
{
    $("#" + thediv).toggle();
}

function hideDiv(thediv) {
    $("#" + thediv).toggle();
}
</script>

改变jquery不使用hide show

4 个答案: