0

いくつかの div スライド ダウンなどを切り替える必要があり、スタック オーバーフローを確認しており、ほとんどの投稿は .next 関数の使用を指していますが、これを実装しても何も起こらないようです。

私のjQueryは

$(document).ready(function(){
        $(".product_slidedown").click(function(){
            $(".slide_details").next('div.product_slidedown').slideToggle();
            });
        });

HTMLは

<div class="product_slidedown" id="1">
        <div class="item_details_heading">
            Product Description
        </div>
        <div class="slide_details"></div>
    </div>
    <div class="product_slidedown" id="2">
        <div class="item_details_heading">
            Product Dimensions
        </div>
        <div class="slide_details"></div>
    </div>

jsFiddle オーバーhttp://jsfiddle.net/RxDcK/

.next 関数を取り出すと機能しますが、両方の div を下にスライドします。

よろしくお願いいたします。

4

4 に答える 4

1

on()代わりに推奨される方法を使用する必要があります...ここに示すように: fiddle

$(document).ready(function () {
    $(".product_slidedown").on('click', function () {
        $(this).find(".slide_details").slideToggle();
    });
});
于 2013-04-24T15:54:56.757 に答える
1

.nextこれは、最上位の div を呼び出しているためです#2。.slide_detailsは の子でdiv.product_slidedownあるため、 next を呼び出しても何も返されません。

クリック バインディングを次のように変更します。

    $(document).ready(function(){
    $(".item_details_heading").click(function(){           
        $(this).next().slideToggle();
        });
    });
于 2013-04-24T15:48:46.190 に答える
1

試す

$(document).ready(function () {
    $(".product_slidedown .item_details_heading").click(function () {
        $(this).next(".slide_details").slideToggle();
    });
});

デモ:フィドル

于 2013-04-24T15:50:49.603 に答える
1

私はこれがあなたが探しているものだと信じています、試してみてください：

http://jsfiddle.net/RxDcK/1/

$(document).ready(function () {
    $(".product_slidedown").click(function () {
        $(this).find(".slide_details").slideToggle();
    });
});

上記のコードでは、クリックした.slide_detailsdiv 内でdivを見つけています。.product_slidedown

于 2013-04-24T15:49:41.440 に答える