使用 Cookies 保存 slideToggle 当前状态答案

【问题标题】：Using Cookies to save slideToggle current state使用 Cookies 保存 slideToggle 当前状态
【发布时间】：2014-04-16 23:06:05
【问题描述】：

我需要一些帮助来开始使用 cookie plugin。

我有一个基本的导航，在 ul 中的 ul，并使用 slideToggle 显示/隐藏部分。我希望它在页面刷新后保持当前状态。我见过一些例子哦，人们是如何用单个 div 做到这一点的，但是 cookie 代码让我有点困惑。如果有人能指出我正确的方向，或者让我开始我的具体示例，我将非常感激。

这是我当前的脚本：

$(document).ready(function(){
    $('.navHeader').children(".subNav").hide();

    $('.navHeader').on('click', function(){
        $(this).children('.subNav').slideToggle(100);
        $(this).siblings().children('.subNav').slideUp(100);
    });
});

这是我的 HTML：

<nav id='navMenu'>
    <ul class='mainNav'>
        <li class='navHeader'>Section 1
            <ul class='subNav'>
                <li>Item 1</li>
                <li>Item 2</li>
                <li>Item 3</li>
                <li>Item 4</li>
            </ul>
        </li>
        <li class='navHeader'>Section 2
            <ul class='subNav'>
                <li>Item 1</li>
                <li>Item 2</li>
                <li>Item 3</li>
                <li>Item 4</li>
            </ul>
        </li>
        <li class='navHeader'>Section 3
            <ul class='subNav'>
                <li>Item 1</li>
                <li>Item 2</li>
                <li>Item 3</li>
                <li>Item 4</li>
            </ul>
        </li>
        <li class='navHeader'>Section 4
            <ul class='subNav'>
                <li>Item 1</li>
                <li>Item 2</li>
                <li>Item 3</li>
                <li>Item 4</li>
            </ul>
        </li>
    </ul>
</nav>

感谢您的所有帮助。

【问题讨论】：

标签： javascript jquery cookies refresh slidetoggle

【解决方案1】：

您可以在此处阅读有关 cookie 的信息： http://www.quirksmode.org/js/cookies.html

它还包含您可以在代码中轻松使用的函数。

编辑： 从那里开始阅读有关 cookie 的信息，然后自己尝试实现所需的内容。如果您需要进一步的帮助，请告诉我们。尝试并完成它总是最好的，因为它会为您赢得一些宝贵的经验。你并不真的需要一个 jQuery 插件来完成这个任务，但这只是我的看法。

【讨论】：