javascript - 折叠父 div 的所有子项

Question

之前有人问过类似的东西，但我找不到这个。

<article class="fyre-comment-article>
    <div class="fyre-comment-wrapper">Parent Post
        <div class="fyre-outer-comment-container"> Contains all child
            <div class="fyre-comment-article">Single child with the same pattern as parent </div>
        </div>
</article>

当父 div 在子 div 之前关闭并且不是括号格式时，我能够处理折叠。

如何通过仅显示“父帖子详细信息”来折叠(单击)父帖子，并且应该在每个父帖子内部应用相同的内容。

谢谢，

Answer 1

您在 article 标签中的类属性缺少右引号，并且其中一个 div 标签根本没有关闭。

但基本上你可以这样做:

$('.fyre-comment-article').click(function() {
    $(this).find('.fyre-outer-comment-container').toggle();
});

当您点击文章标签内的文本时，这将显示/隐藏两个最嵌套的 div。

这是一个 JSFiddle .

---

更新

如果您在脚本加载后向 DOM 添加元素，则绑定(bind)对它们不起作用，您可以使用 .on() 方法修复它，如下所示:

$(document).on('click', '.fyre-comment-article', function() {
  $(this).find('.fyre-outer-comment-container').toggle();
});