javascript - 想要使用 jQuery .nextUntil 但排除中间的 div

Question

我是 jQuery 的新手，所以请原谅!

我有一个 PHP 函数可以从 MySQL 数据库返回一个博客；它返回标题、副标题和内容。

$result = getData();  
            while($row = mysqli_fetch_array($result))
            {
                extract($row);
                ?>
                    <div class="headline"><?php echo $headline ?></div>
                    <div class="subtitle"><?php echo $subTitle ?></div>
                    <div class="content"><?php echo $content ?></div>
                    <?php
            } 

目前显示了三个条目。我有一个 jQuery，它隐藏内容并在单击标题时使用 nextUntill 方法和内容上的 .slideToggle 展开内容。

    $(".content").hide();

$(".headline").click(function(){
    $(this).nextUntil(".headline").slideToggle(500);  
}); 

我的问题是 slideToggle 在每个 div 上执行，直到下一个标题，其中包括副标题。因此，当点击标题时，内容会显示，但标题会消失。

我不能只选择要滑动的内容，因为它会滑动然后显示所有三个内容 div。

有没有办法在标题和内容之间排除副标题？

提前致谢!

Answer 1

假设我没听错，您想隐藏下一个 .content 元素。如果是这样，您可以从以下兄弟元素中获取与该选择器匹配的第一个元素:

$(this).nextAll(".content").eq(0).slideToggle(500);

或者，要按照你的建议去做，你可以使用not:

$(this).nextUntil(".headline").not(".subtitle").slideToggle(500);

这是一个 working example第一个版本。