Question

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

这是我的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或锚点，但它仍然无法正常工作。但是我有一个功能，可以将每个锚点与网址进行比较，但不知道如何在菜单中使用它。

我真的很感激这方面的一些帮助。

谢谢！

Answer 1

看来你还有一个额外的

</div>

请将其删除，然后重试。通常这种小问题导致手风琴不能正常工作或根本不工作。

Answer 2

我已经弄清楚了...... 我必须使用$（＆＃39;＃accordion＆＃39;）。accordion（＆＃39; option＆＃39;，＆＃39; active＆＃39;，3）; 显然3是H3的数量而不是锚点，所以我使用的4号并不对应任何东西。

Answer 3

如果您使用的是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

如何创建一个保持打开的JQuery手风琴导航？

3 个答案: