Question

基本上我有一排链接和一个坐在它们下面的div，内容被加载到其中。

在整个页面中有几个重复的块，所以我只想选择第一个div，其中“active”类位于当前链接之下。

下面是一个小提琴，显示了行动中的问题。正如您所看到的，我尝试使用:first，但这会选择页面中的第一个，而不是当前链接下面的第一个。

$(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 preview

或使用$(this).nextAll()：

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

jsFiddle preview

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);

用class选择第一个div

3 个答案: