javascript - jQuery如何选择div中的所有元素

Question

我的网站上有问答部分(FAQ)。

HTML 看起来像这样

<div class="faq">
   <div class="container">

     <!-- FAQ 1 -->
     <h3><a href="">My FAQ 1</a></h3>
     <div><p>Answer to MY FAQ 1</p></div>

     <!-- FAQ 2 -->
     <h3><a href="">My FAQ 1</a></h3>
     <div><p>Answer to MY FAQ 1</p></div>   

     <!-- FAQ 3 -->
     <h3><a href="">My FAQ 1</a></h3>
     <div><p>Answer to MY FAQ 1</p></div>

   </div>    
</div>  

jQuery 看起来像这样

$(document).ready(function() {
    $(".faq h3 a").click(function(){
        $(this).parent().next().toggle();
        return false;
    })
});

这工作正常，但我需要的是，如果有人点击任何一个常见问题解答，并且如果打开任何其他常见问题解答，那么它应该自动关闭。

我试过这样做

$(".faq h3 a").not($(this)).hide();

但它不起作用。

Answer 1

也许不是 jQuery 最优雅的用法

$(document).ready(function() {
    $(".faq h3 a").click(function(){
        var isVis = $(this).parent().next().css('display') == 'block';
        $(".faq h3 + div").hide();
        $(this).parent().next().toggle(!isVis);
        return false;
    })
});

jsfiddle

This should toggle correctly, i.e. click on an open FAQ it will close it