0

私はここで質問をしました: jQuery どのようにslideToggleを作成するかは、各項目に1つずつ適用されます

そして、私はここで正しい答えを得ました: FIDDLE

<div class="items">
    <div class="warp">
        <span class="change">Tester</span>
         <span class="click">expand</span>
    </div>
    <div class="invisible">
        <div class="red"> red </div>
        <div class="black"> black </div>
    </div>
</div>

<div class="items">
    <div class="warp">
        <span class="change">Tester</span>
         <span class="click">expand</span>
    </div>
    <div class="invisible">
        <div class="red"> red </div>
        <div class="black"> black </div>
    </div>
</div>

<div class="items">
    <div class="warp">
        <span class="change">Tester</span>
         <span class="click">expand</span>
    </div>
    <div class="invisible">
        <div class="red"> red </div>
        <div class="black"> black </div>
    </div>
</div>

jQuery:

$(".warp").click(function () {
    var $warp = $(this);

    $warp.next(".invisible").slideToggle("slow", function () {
        if ($(this).is(':visible')) {
            $warp.removeClass('bg');
        }else{            
            $warp.find('span.click').css('visibility', 'visible');  
            $warp.addClass('bg');
        }
    });

    $warp.find('span.click').css('visibility', 'hidden');      
  });

私の質問は、1 つが選択されたときに、他の div をスライドする方法を切り替えることですinvisible。

ありがとう

4

1 に答える 1

1

そのようなもので目に見える要素を選択するだけ:visibleです:

var siblings = $warp.parent().siblings('.items').find('.invisible:visible')

siblings.slideToggle("slow", function () {
    var parent = $(this).prev('.warp');
    if ($(this).is(':visible')) {
        parent.removeClass('bg');
    }else{            
        parent.find('span.click').css('visibility', 'visible');  
        parent.addClass('bg');
    }
});

ここにフィドルがあります：http://jsfiddle.net/az8T7/4/

于 2013-05-15T23:26:31.487 に答える