簡單的摺疊式菜單（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'); 
}); 

Answer 2

$('.accordion .answer').hide(); // hide all 
$('.accordion .question').click(function(){ 
    if($(this).hasClass('active')) { 
     $(this).removeClass('active').next().slideUp(); 
    } else { 
     $('.accordion .answer').removeClass('active').slideUp(); 
     $(this).addClass('active').next().slideDown(); 
    } 
    return false; 
}); 

但是你真的應該看看jQuery UI Accordion。