asp：RadioButtonList和jQuery来显示隐藏面板

Question

我有一个asp：RadioButtonList名为rblDependants 呈现如下和一个面板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> 

Answer 1

像这样的东西应该工作：

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

这对于任何数量的重复控制的工作，因为它找到<div id="X_pnlDependants">比较。我们所做的是采取一个<table>谁是ID ends-with_rblDependants，其中任何:radio按钮，并绑定到他们的.change()事件。然后，他们中的任何一个都被更改，它检查结果是value="Yes"，它是.checked，如果情况显示面板，则通过.toggle(bool)隐藏它。

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

You can give it a try here