slideToggle 上的 jQuery Cookie答案

【问题标题】：jQuery Cookie on slideToggleslideToggle 上的 jQuery Cookie
【发布时间】：2013-09-27 17:22:15
【问题描述】：

我有一个导航栏和一个隐藏的子导航栏。当我单击 Page2 时，隐藏的栏会出现（使用 slideToggle）。到目前为止，一切都很好。现在客户端想要，当子导航显示栏，然后他再次单击 Page3 或 Page1 子导航栏一直显示，直到他再次单击 Page2。我知道为此我需要 cookie。我试图通过我自己，但没有努力，因为这是第一次我使用 JS cookie。我敢肯定有人知道如何做到这一点 jQuery 脚本

<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.js" type="text/javascript"></script>
<script type="text/javascript" src="https://raw.github.com/carhartl/jquery-cookie/master/jquery.cookie.js"></script>
</head>
<body>
<nav>
    <ul>
        <li><a href="index.html">Page1</a></li>
        <li id="item"><a href="#">Page2</a></li>
        <li><a href="page3.html">Page3</a></li>
    </ul>
</nav>
<br /><br />
<ul id="sub-nav">
    <li><a href="#">Subpage1</a></li>
    <li><a href="#">Subpage2</a></li>
    <li><a href="#">Subpage3</a></li>
</ul>
</body>

CSS：

<style type="text/css">
    *{margin: 0; padding: 0;}
    ul{list-style:none; font: 20px; float: left;}
    ul li{float: left; margin-right: 20px;}
    #sub-nav{font:14px; display: none;}
</style>

jQuery:

<script type="text/javascript">
    $(document).ready(function(){
        $('#item').click(function(){
            $('#sub-nav').slideToggle('fast');          
        });
    });
</script>

【问题讨论】：

标签： jquery slidetoggle jquery-cookie

【解决方案1】：

http://www.sitepoint.com/eat-those-cookies-with-jquery/

http://www.electrictoolbox.com/jquery-cookies/

使用 jQuery 设置 cookie 就这么简单，其中创建了一个名为“example”的 cookie，当前路径的值为“foo”：

$.cookie("example", "foo");

删除此 cookie

$.removeCookie("example");

读取 cookie

$.cookie("example",  { path: '/' });//you might change the path here

【讨论】：