javascript - 简单的 Accordion 菜单 (jQuery)

Question

jQuery:

// ACCORDION
$('.accordion .answer').hide(); // hide all
$('.accordion .question').click(function(){
     $('.accordion .answer').slideUp(); // hide all open
     $(this).addClass('active').next().slideDown(); // show the anwser
     return false;
});

HTML:

<dl class="accordion">
    <dt class="question">question</dt>
    <dd class="answer">answer</dd>
    <dt class="question">question</dt>
    <dd class="answer">answer</dd>
</dl>

... 有效，但是

• 必须从非事件问题元素中删除“事件”类 &
• 至少有一个答案是开放的；所有答案都应该能够关闭。

谢谢!

Answer 1

好吧，想通了:

$('.accordion .answer').hide(); // hide all
$(".accordion .question").click(function () {
    $(this).toggleClass('active').next(".answer").slideToggle(300).siblings(".answer").slideUp("slow");
    $(this).siblings().removeClass('active');
});