jquery - 如何使用 jquery 切换来显示/隐藏帖子回复？

Question

我希望在页面加载时隐藏帖子回复，然后在单击链接时切换：

html:

<!-- the post div-->
<div class="post">
<!-- the post content -->
<div class="clicker">click me</div>
<!-- end of the post -->
</div>

<!--begin replies div -->

<div class="container">

<div class="reply">
text in here
</div>

<div class="reply">
text in here
</div>

<div class="reply">
text in here
</div>

</div>

<!--- end replies div -->

<!-- repeat again etc-->

CSS：

.container {
display: none;
}

jQuery：

$(function() {
    $(".clicker").click(function() {
    $(this).closest('.container').toggle('blind'); 
    });
});

jsfiddle：

http://jsfiddle.net/rwone/grBkm/9/（已解决的解决方案）

Answer 1

您的问题在于您对该.closest()功能的使用。它遍历 DOM 树，从选择器元素开始，寻找与选择器匹配的第一个元素。但是，您.clicker <div>是您的兄弟姐妹的孩子.container <div>，因此您想先上到.post <div>，然后再跨到.container。

您可以通过执行以下操作来实现：

$(this).closest('.post').next('.container').toggle('blind');

看看一个更新的演示。

Answer 2

试试这个链接..它显示了一个很好的例子。 http://papermashup.com/simple-jquery-showhide-div/

这应该工作..使用 next() 而不是最接近()

$(this).next('.container').toggle('blind');