带有多个描述项的jQuery Accordion定义列表

Question

我似乎无法使用具有多个desciption项(dd)的定义列表的jQuery Accordions.作者的例子只有单个dd项.

在下面的例子B2中,B3和C2显示onLoad,而不是像我希望的那样隐藏A1,B1和C1.

我怎么做到这一点？

jQuery('dl').accordion({ 
    event: 'click',     
    active: false, 
    animated: "bounceslide", 
    header: "dt" 
});?

<dl>

    <dt>A</dt>
    <dd>A1</dd>

    <dt>B</dt>
    <dd>B1</dd>
    <dd>B2</dd>
    <dd>B3</dd>

    <dt>C</dt>
    <dd>C1</dd>
    <dd>C2</dd>

</dl>

(直播jsFiddle版)

Answer 1

• 演示: http ://so.lucafilosofi.com/jquery-accordion-definition-list-with-multiple-description-items

$(function () {
    $('dt').on('click', function (e) {
        e.preventDefault();
        $(this).parent('dl').children('dd:visible').slideUp('slow');
        $(this).nextUntil('dt').filter(':not(:visible)').slideDown('slow');
    });
});

注意:

如果你想要多个部分

马上打开,不要使用手风琴

• 手风琴不允许同时打开多个内容面板,这需要花费很多精力.如果您正在寻找允许打开多个内容面板的小部件,请不要使用它.通常它可以用几行jQuery编写,例如 : http ://jqueryui.com/demos/accordion/

希望这个帮助!;)