jquery - jQuery用标签连接手风琴

Question

我会将手风琴与类似于此处的 jQuery 官方演示的选项卡连接，但不是列表，而是使用手风琴......这可能吗？有人可以为我提供一个工作示例吗？

Answer 1

有一架手风琴 | jQuery UI演示。

如果您使用，您应该能够将标签与手风琴结合起来

$(function() {
   $( "#tabs" ).tabs();
   $( "#accordion-1" ).accordion();
   $( "#accordion-2" ).accordion();
});

和这样的HTML结构

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Tab 1</a></li>
        <li><a href="#tabs-2">Tab 2</a></li>
        <li><a href="#tabs-3">Tab 3</a></li>
    </ul>
    <div id="tabs-1">
        <div id="accordion-1">
            <h3>Section 1</h3>
            <div>
                <p>
                Tab 1 - Section 1
                </p>
            </div>
            <h3>Section 2</h3>
            <div>
                <p>
                Tab 1 - Section 2
                </p>
            </div>
        </div>
    </div>
    <div id="tabs-2">
        <div id="accordion-2">
            <h3>Section 1</h3>
            <div>
                <p>
                Tab 2 - Section 1
                </p>
            </div>
            <h3>Section 2</h3>
            <div>
                <p>
                Tab 2 - Section 2
                </p>
            </div>
        </div>
    </div>
</div>