-3

表の行にチェックボックスがあり、次の表の行に3つのラジオボタンがあります。ページをロードしている間、ラジオボタンは表示されません。

スライドアップスライドダウン効果とともにラジオボタンを表示できるオンクリック機能を作成するにはどうすればよいですか？

<td>
<input type="checkbox" id="appalert" name="appalert" value="appalert"  onclick="toggleRadioButtonPanel(this);"> alert
</td>

<td>
<label class="alertTypePanel" style="visibility: hidden">alertType: </label>
<input type="radio" name="alertTypeOpt" id="alertTypeOpt1" class="alertTypePanel" value="Ticker" style="visibility: hidden">
<label class="alertTypePanel" style="visibility: hidden" style="visibility: hidden">Ticker</label>
<input type="radio" name="alertTypeOpt" id="alertTypeOpt2" class="alertTypePanel" value="Pop up" style="visibility: hidden">
<label class="alertTypePanel" style="visibility: hidden">Pop up</label>
</td>
4

2 に答える 2

0

これを試して

デモ

$('#appalert').click(function(){
   $('label, input:radio').toggleClass('alertTypePanel').slideToggle();
});​​​​

<table>
<tr>
<td>
<input type="checkbox" id="appalert" name="appalert" value="appalert" > alert
</td>

<td>
 <label class="alertTypePanel" >alertType: </label>
 <input type="radio" name="alertTypeOpt" id="alertTypeOpt1" class="alertTypePanel"     value="Ticker" >
<label class="alertTypePanel" >Ticker</label>
<input type="radio" name="alertTypeOpt" id="alertTypeOpt2" class="alertTypePanel" value="Pop up" >
<label class="alertTypePanel" >Pop up</label>
</td>
</tr></table>

.alertTypePanel{
 display:none;
}​
于 2012-11-07T08:07:01.327 に答える
0 
<td>
    <input type="checkbox" id="appalert" name="appalert" value="appalert" class="appalert"> alert
</td>

<td>
  <div class="toggle" style="display:none;">
    <label class="alertTypePanel">alertType: </label>
    <input type="radio" name="alertTypeOpt" id="alertTypeOpt1" class="alertTypePanel" value="Ticker">
    <label class="alertTypePanel">Ticker</label>
    <input type="radio" name="alertTypeOpt" id="alertTypeOpt2" class="alertTypePanel" value="Pop up">
    <label class="alertTypePanel">Pop up</label>
  </div>
</td>

$('.appalert').click(function(){
    $(this).parent().next('td').find('.toggle').slideToggle();
});
于 2012-11-07T08:05:00.477 に答える