1

我有一个名为 rblDependants 的 asp:RadioButtonList ，它呈现如下和一个面板 pnlDependants ，当单选按钮选择为“否”时我需要隐藏它，并在其“是”时显示它。我已经尝试了论坛中的一些片段，但似乎没有一个可以正常工作。任何人都可以帮助我......！

  <table id="ctl00_ContentPlaceHolder1_ctl02_rblDependants"  border="0" style="border-width:0px;">
        <tr>
            <td><input id="ctl00_ContentPlaceHolder1_ctl02_rblDependants_0" type="radio" name="ctl00$ContentPlaceHolder1$ctl02$rblDependants" value="Yes" /><label for="ctl00_ContentPlaceHolder1_ctl02_rblDependants_0">Yes</label></td>
        </tr><tr>
            <td><input id="ctl00_ContentPlaceHolder1_ctl02_rblDependants_1" type="radio" name="ctl00$ContentPlaceHolder1$ctl02$rblDependants" value="No" checked="checked" /><label for="ctl00_ContentPlaceHolder1_ctl02_rblDependants_1">No</label></td>
        </tr>
</table>

<div id="ctl00_ContentPlaceHolder1_ctl02_pnlDependants">

                    <div class="QuestionWrapper">

                        <div class="Question">
                            <label for="">No. of Dependants</label>
                        </div>
                        <div class="Answer">
                            <input name="ctl00$ContentPlaceHolder1$ctl02$txtNoOfDependants" type="text" maxlength="2" id="ctl00_ContentPlaceHolder1_ctl02_txtNoOfDependants" />
                        </div>
                        <div class="ClearFloat"></div>
                    </div>
4

1 回答 1

3

像这样的东西应该工作：

​$("table[id$=_rblDependants] :radio").change(function() {
    $(this).closest('table').next().toggle(this.checked && this.value == 'Yes');
})​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​.change()​;​

这适用于任何数量的重复控件，因为它找到了<div id="X_pnlDependants">相对的。我们所做的一切都是以<table>who 的 ID结尾 _rblDependants，获取其中的任何:radio按钮并绑定到他们的.change()事件。然后它们中的任何一个被更改，它正在检查结果value="Yes"是否为.checked，如果是这种情况，则显示面板，否则隐藏它，通过.toggle(bool).

.closest()和将.next()上升到<table>然后到下一个元素， the <div>，因为那是您要隐藏/显示的内容。最后.change()是最初触发处理程序，因此如果最初选中“否”，它会隐藏<div>加载。

你可以在这里试一试

于 2010-08-10T11:42:13.060 回答