jquery - 单击时关闭 Active Accordion 面板...似乎始终打开一个面板

Question

http://jsfiddle.net/buhlett/paw5w/

手风琴工作顺利，但它不允许我在任何时候关闭所有面板。一个面板始终被强制打开。

我很确定我错过了一两行

jQuery

$(document).ready(function() {
// Store variables
var accordion_head = $('.grape-accordion > li > a'),
    accordion_body = $('.grape-accordion li > .grape-sub-menu, .grape-last-sub-menu');
// Open the first tab on load
// Click function
accordion_head.on('click', function(event) {
    // Disable header links
    event.preventDefault();
    // Show and hide the tabs on click
    if ($(this).attr('class') != 'active') {
        accordion_body.slideUp('normal');
        $(this).next().stop(true, true).slideToggle('normal');
        accordion_head.removeClass('active');
        $(this).addClass('active');
    }
});
});​

HTML

<div>
    <ul class="grape-accordion">
        <li id="one" class="share"><a href="#one">-</a>
        <ul class="grape-sub-menu">
            <li><a href="#"><em>»</em>-</a></li>
        </ul>
        </li>
        <li id="two" class="mail"><a href="#two">-</a>
        <ul class="grape-sub-menu">
            <li><a href="#"><em>»</em>-</a></li>
        </ul>
        </li>
        <li id="two" class="mail"><a href="#two">-</a>
        <ul class="grape-sub-menu">
            <li><a href="#"><em>»</em>-</a></li>
        </ul>
        </li>
    </ul>
</div>

Answer 1

你的意思是像这个jsFiddle 例子吗？如果是这样，我所做的就是添加一个 else 子句。

else {
        accordion_body.slideUp('normal');
        accordion_head.removeClass('active');
    }