0

我正在尝试创建一个手风琴导航菜单，当我单击某个页面时该菜单保持打开状态。不幸的是，在尝试了我在网上找到的解决方案后，我仍然无法打开它。

这是我的 jQuery ：

$(function() {
    var icons = {
    header: "ui-icon-circle-arrow-e",
    activeHeader: "ui-icon-circle-arrow-s"
    };

    $( "#accordion" ).accordion({
    header: "h3",
    navigation: true,
    heightStyle: "content",
    icons: icons
    });
    $( "#toggle" ).button().click(function() {
    if ( $( "#accordion" ).accordion( "option", "icons" ) ) {
    $( "#accordion" ).accordion( "option", "icons", null );
    } else {
    $( "#accordion" ).accordion( "option", "icons", icons );
    }
    });
});

这是我的菜单：

<div id="accordion" style="float:left;">
  <h3>Datamarts & Logs</h3>
  <div>
    <a href="index.php"><div class="left_menu_button">Registered instances</div></a>
    <a href="add_instance.php"><div class="left_menu_button">Add instance</div></a>
    <a href="databases_info.php"><div class="left_menu_button">Databases info & logs</div></a>
  </div>
  </div>
  <h3>Administration</h3>
  <div>
    <a href="operations_history.php"><div class="left_menu_button">Operations history</div></a>
    <a href="users.php"><div class="left_menu_button">Users</div></a>
  </div>
  <h3>Tools</h3>
  <div>
    <a href="links.php"><div class="left_menu_button"><span>Links</span></div></a>
        <a href="projects.php"><div class="left_menu_button"><span>Projects</span></div></a>       
  </div>
</div>

我尝试将#id 添加到 h3 或链接末尾的锚点，但它仍然不起作用。但是，我确实有一个功能可以将每个锚点与 url 进行比较，但不知道如何在菜单中使用它。

我真的很感激在这个问题上的一些帮助。

谢谢 ！

4

3 回答 3

1

看来你有一个额外的

</div>

请删除它并重试。通常这种小问题会导致手风琴无法正常工作或根本无法工作。

于 2013-02-15T11:17:04.707 回答
0

我想通了...我必须使用 $('#accordion').accordion('option', 'active', 3); 显然 3 是 H3 的编号而不是锚点，所以我使用的 4 没有对应任何东西。

于 2013-02-15T14:04:26.527 回答
0

如果您使用的是 html5，您可以将手风琴索引存储在localStorage["key"]进入新页面之前。该localStorage["key"]作品用作持久存储。

localStorage["last_opened_index"] = accordionIndex;

然后在下一页：

var acc_index = = localStorage["last_opened_index"] !== undefined ? localStorage["last_opened_index"] : localStorage["last_opened_index"] = 0;

$('#accordion').accordion('option', 'active', acc_index);

如果您有比这更好的方法，请评论如何，如果您必须补偿它，我会添加投票：D

于 2013-06-24T11:08:55.580 回答