Question

我正在尝试使用JQuery UI创建一个手风琴，允许用户动态地向手风琴添加其他面板。添加其他面板时，默认情况下应该打开它。我已经完成了大部分工作，然而，最后一部分让我撕裂了我的头发。

<div id='accordion'>
    <h4>Panel 1 Link</h4>
    <div>
        Panel 1 content goes here
    </div>
    <h4>Panel 2 Link</h4>
    <div>
        Panel 2 content goes here
    </div>
</div>
<a href='#add' id='addPanel' onclick='addPanel(3)'>Add Panel</a>

Javascript

<script>
function addPanel(panelNo) {
        var panelContent = "<h4>Panel " + panelNo + " Link</h4><div>Panel " + panelNo +     " content goes here</div>"
             $('#accordion').append(panelContent).accordion('destroy').accordion({collapsible: true,     active: panelNo});

        var newPanelBtn = panelNo + 1;
        $('#addPanel').html("<a href='#add' id='addPanel' onclick='addPanel(" +     newPanelBtn + ")'>Add Panel</a>");
}
</script>

除了事实上，当添加一个面板时，它应该是打开的，但是当选择另一个面板时它不会关闭。

Answer 1

以下对重新创建手风琴的javascript的调整应该为您排序问题：

$('#accordion').append(panelContent).accordion('destroy').accordion({collapsible: true,     active: ":last"});

JQuery UI Accordion，动态添加面板

1 个答案: