用于3级可折叠jQuery菜单的Cookies

我使用此脚本存储有关展开和折叠菜单级别的信息：

    $('#menu li:has(ul) a').click(function() {
$(this).next().toggle();
if ($(this).next().is(':visible')) {
    $.cookie($(this).text(), 'expanded');
}

if ($(this).next().is(':hidden')) {
    $.cookie($(this).text(), 'collapsed');
}
});


$('.item').each(function() {
    var verticalNav = $.cookie( $(this).children('a').text() );
    if (verticalNav == 'expanded') {
        $(this).find('ul').show();
    }
});

适用于2级菜单。例如：

<ul>
<li>item 1
    <li>item 1.1</li>
</li>

项目1
项目1.1

但当我把第三个层次：

<ul>
<li>item 1
    <li>item 1.1
        <li>item 1.1.1</li>
    </li>
</li>

项目1
项目1.1
项目1.1.1

---

如果我仅在级别2中单击，当页面刷新时，将显示级别3。

注意，当前解决方案仅存储上次单击的项目，而不是完整列表

我建议在每个项目上放置ID，然后为扩展项目存储一个ID数组。然后，在页面加载时，折叠所有内容，然后展开数组中的项。或者存储折叠的项目，并从展开的所有内容开始，以适合您的设计为准。迭代所有项目并每次比较文本会随着项目的增多而变慢

我已经把一个小样本放在了一起

我有点过火了，创建了一个对象来跟踪哪些项目被展开。我也在用巧克力而不是饼干；这是个人喜好。要将其更改为使用cookies，只需将“store.get”或“store.set”替换为“$.cookie”