如何在此jQuery手风琴小部件中指定选择/激活的项目？

Question

我正在建立一个this framework之外的网站，我正在尝试自定义部分菜单手风琴的功能。我希望所选/活动项目能够反映当前显示的页面。目前，正如您在代码中看到的那样，它默认选择第一个项目：

SectionMenu : function(){
$("#section-menu")
    .accordion({
        "header": "a.menuitem"
    })
    .bind("accordionchangestart", function(e, data) {
        data.newHeader.next().andSelf().addClass("current");
        data.oldHeader.next().andSelf().removeClass("current");
    })
    .find("a.menuitem:first").addClass("current")
    .next().addClass("current");
},

到目前为止，我已经能够在页面上指定要选择的项目：

<script>
    $("#section-menu")
    .accordion({
        "header": "a.menuitem",
        "collapsible": true,
        "active":4
    });
</script>

现在的问题是，第一个项目仍然会突出显示为当前项目。我附上了一张图片，以便更好地说明我所描述的内容：

我应该从哪里走到这边去？

谢谢！

修改

我评论了SectionMenu块的最后两行，这解决了始终被选为当前的第一个项目的问题。现在我只需要能够.addClass("current")到适当的项目，这应该有效。

解决方案

在上一次编辑中，我删除了SectionMenu块中的最后两行，并将以下代码添加到每个页面的<script>部分：

<script type="text/javascript">
    $("#section-menu")
    .find("[href^='<HREF>']:first").addClass("current")
    .next().addClass("current");
</script>

<HREF>是页面名称。这样可以正确地选择CSS并将其应用于适当的节点。

Answer 1

您可以为基于href的状态保存设置navigation选项true。 Documentation here

$("#section-menu")
.accordion({
    "header": "a.menuitem",
    "collapsible": true,
    "navigation": true
});

Answer 2

<script type="text/javascript">
    $("#section-menu")
    .accordion({
        "header": "a.menuitem",
        "collapsible": true,
        "active": <INDEX>
    });
</script>

<INDEX>是您手风琴的<INDEX>th a.menuitem元素

您可以在accordion's documentation page

上阅读更多内容