Question

jquery ui手风琴包含很多面板，每个面板都包含很多单行菜单项。 jqueryui手风琴在每个面板中仅显示单个项目。如何强制手风琴展示更多物品？

$( "#accordion" ).accordion({
        fillSpace: true,
        autoHeight: false,
        navigation: true,
    collapsible: true
});




<h3>
    <a href="#">mmmmmmm</a></h3>
    <div>
        <ul>
            <li><a target='DoklstlG' href='xxxxxx'>
                jjjjjj</a></li>
            <li><a target='DoklstlO' href='yyyyy'>Ostuarve</a></li>
            <li><a target='UnpaidG' href='zzzzzzz'>hjkhkjjsumine</a></li>
            <li>&nbsp;</li>
...
        </ul>
    </div>

<h3>
    <a href="#">kkkkk</a></h3>
<ul>
    <li><a target='DoklstlVL' href='nnnnnnnn'>V&#228;ljastus</a></li>
    <li><a target='DoklstlSL' href='mmmmmmmmmm'>Sissetulek</a></li>
...

Answer 1

正如另一个答案所说，文档明确指示用户不要这样做

"NOTE: If you want multiple sections open at once, don't use an accordion."

然而，还有一种方法。我这样使用它，我发现它非常简单实用：
创建多个单项式手风琴面板，可折叠设置为true，以模拟多面板手风琴。

这是标记：

<div class="accordion">
    <h3><a href="#">First header</a></h3>
    <div>First content</div>
</div>
<div class="accordion">
    <h3><a href="#">Second header</a></h3>
    <div>Second content</div>
</div>
<div class="accordion">
    <h3><a href="#">Third header</a></h3>
    <div>Third content</div>
</div>

这是脚本：

$(".accordion").accordion({collapsible: true});

Answer 2

文档明确指示用户不要这样做：

注意：如果您想一次打开多个部分，请不要使用手风琴。

来源：jQuery UI Documentation

更新

尝试更改fillSpace: false和autoHeight : true，看看它的作用。

如何在单个jquery ui手风琴开放部分中显示多个项目

2 个答案: