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

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

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

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

提前致谢！

Answer 1

假设我已正确理解您，您希望隐藏下一个.content元素。如果这是正确的，您可以从以下兄弟姐妹的集合中获得与该选择器匹配的第一个元素：

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

或者，按照您的建议进行操作，您可以使用not：

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

这是第一个版本的working example。

Answer 2

我正在猜测，因为我以这种方式理解了问题，所以你可以试试not选择器.not()

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

想要使用jQuery .nextUntil但在它们之间排除一个div

2 个答案: