0 
<div id="formheadtop">
 <input class="checkbox" type="checkbox" /></div><div class="formbody"></div>
<div id="formheadtop">
<input class="checkbox" type="checkbox" /></div><div class="formbody"></div>
<div id="formheadtop"><input class="checkbox" type="checkbox" /></div><div class="formbody"></div>



$(function() { $('input:checkbox').live('click', function () {
if ( $(this).attr('checked') == true ) 
{
    $(this).nextAll('.formbody:first').fadeIn();
}
else
{ 
$('.formbody').fadeOut();
};
});

コードが機能しません。次のdiv.formbodyだけフェードアウトしたい。

4

1 に答える 1

2

s は一意でなければならないため、最初に に変更id="formheadtop"する必要があります。次に、このコードを使用してsをフェードインおよびフェードアウトできます。class="formheadtop"IDDIV

jQuery

$(document).ready(function(){
  $('.formheadtop :checkbox').live('click', function() {
    if ($(this).is(':checked')) {
      $(this).parent().next('.formbody').fadeIn();
    }  else { 
      $(this).parent().next('.formbody').fadeOut();
    };
  });
});

と短く$(this).parent().next('.formbody')することもできますが$(this).parent().next().fadeIn()、間に何かを入れたい場合に備えて、セレクターを入れました。

HTML

<div class="formheadtop"><input class="checkbox" type="checkbox" checked="checked" /></div>
<div class="formbody">test</div>
<div class="formheadtop"><input class="checkbox" type="checkbox" checked="checked" /></div>
<div class="formbody">test</div>
<div class="formheadtop"><input class="checkbox" type="checkbox" checked="checked" /></div>
<div class="formbody">test</div>

デフォルトでチェックボックスをオンにしました。formbodyそうでない場合は、タグ内のコンテンツを非表示にする必要があります。

これが実際のコードです。

于 2010-07-23T23:24:09.867 に答える