jQuery 选择下一个最接近的类

Question

我有一个简单的常见问题解答列表

<div class='qcontainer'>
    <p>Q:</p>
    <div class='question'>Question</div>
</div>
<div class='acontainer'>
    <p>A:</p>
    <div class='answer'><p>Answer</p></div>
</div>
<div class='qcontainer'>
    <p>Q:</p>
    <div class='question'>Question</div>
</div>
<div class='acontainer'>
    <p>A:</p>
    <div class='answer'><p>Answer</p></div>
</div>

我想做的就是在单击问题时切换下一个回答者的可见状态。

到目前为止我已经得到了

   $('.qcontainer').bind("click", function (e) {
        $('.qcontainer').next('.acontainer').toggle(400);
    });

但这会切换所有项目，我想做的只是针对单击的问题的答案。因此列表中的下一项来自单击的对象。

Answer 1

尝试像下面这样，

$('.qcontainer').bind("click", function (e) {
    $(this).next().toggle(400);
});

对于您拥有的标记，qcontainer 的 .next 是 acontainer，因此您可以简单地使用 .next > 切换acontainer并且不用担心任何事情:)