jquery - クラスで最初の div を選択する

Question

基本的に、リンクの行と、その下にコンテンツが読み込まれる div があります。

ページ全体でこれらのブロックがいくつか繰り返されるため、現在のリンクの下にある「アクティブ」クラスの最初の div のみを選択します。

以下は、実際の問題を示すフィドルです。ご覧のとおり、使用しようとしまし:firstたが、これは現在のリンクの下の最初のものではなく、ページの最初のものを選択します。

http://jsfiddle.net/wdcn6/11/

$(function () {
$('.accordionContent').hide();

    $(".accordionButton").click(function () {

        var content_id = $(this).attr('href');

        $('.active:first').html($(content_id).html()).show(500);
        return false;
    });
});

Answer 1

$('.active:first')それ自体は常にドキュメントの最初のものと一致し.activeます。

クリックされたリンクの後にのみマッチを開始するには、兄弟コンビネータを:first使用できます。$(this).find()

$(this).find('~ .active:first').html($(content_id).html()).show(500);

jsFiddle プレビュー

または使用$(this).nextAll()：

$(this).nextAll('.active:first').html($(content_id).html()).show(500);

jsFiddle プレビュー

Answer 2

このjsfiddle http://jsfiddle.net/wdcn6/14/を確認してください

$(function () {
    $('.accordionContent').hide();

        $(".accordionButton").click(function () {

            var content_id = $(this).attr('href');

           $(this).nextAll('.active').first().html($(content_id).html()).show(500);
            return false;
        });
    });

Answer 3

このようなものはどうですか：

$(content_id + ' ~ .active:first').html($(content_id).html()).show(500);