javascript - jQuery最接近（）帮助

Question

所以我在一个页面上有几个带有这个标记的容器：

        <div class="box w400">
            <div class="box-header">
                <span class="expand-collapse">expand/collapse</span>
                <h3>Heading</h3>
            </div>
            <div class="box-content">
                <p>Some content here...</p>
            </div>
        </div>

我试图在点击 .expand-collapse 跨度后实现这一点， .box-content div 将向上或向下滑动（切换）。

这是我正在使用的 jQuery，我正在尝试使用最接近（）来实现这一点：

        $(document).ready(function() {
            $('.expand-collapse').click(function() {
                $(this).closest('.box-content').slideToggle('slow');
            });
        });

但由于某种原因它不起作用:(

Answer 1

试试这个：

$(document).ready(function() {
    $('.expand-collapse').click(function() {
        $(this).parent().next('.box-content').slideToggle('slow');
    });
});

选择父 div 的下一个兄弟，它不使用最接近的。

Answer 2

close() 找到关闭的父元素。在您的情况下，跨度没有任何具有类 .box-content 的父元素。为什么不直接做 $('.box-content').slideToggle('slow'); ??

编辑：我错过了你在一个页面上有几个的部分。parent().next 应该可以工作。