0

我对 javascript 相当陌生,似乎在使用 cookie 时遇到了问题。我发现很多帖子都有类似的问题,但是当我开始阅读答案时,我变得越来越困惑。我什至尝试跟随 youtube tuorials,但似乎找不到能正确解释它的人。在过去的 3 个小时里,我一直坚持这一点,我现在不能放弃。

我有一个可以切换为可见或不可见的 div。我为此使用了一个javascript函数。

function exp_col(x, y){
 x = document.getElementById(x);
 y = document.getElementById(y);

if (x.style.display == "block") {
    x.style.display = "none";
    y.src = "images/layout/plus.png";
} else {
    x.style.display = "block";
    y.src = "images/layout/minus.png";
}}

当用户切换 div 时,我希望能够记住这一点并保持 div 的状态相同,即使他们转到不同的页面。有人告诉我我需要饼干,但我似乎无法制作一个有效的。我不确定我是否正确理解它们。我知道他们成对存储信息,如名称-值,但我不明白如何使用它来做我想做的事。我在哪里设置cookie?我该如何设置?我如何使用它来做我想做的事?我现在真的很困惑,希望能得到一些帮助。

切换@ http://hello-world.cu.cc的实时示例

谢谢

4

2 回答 2

1

这是您可能需要的粗略示例

<html>
<head>
   <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
   <script type="text/javascript" src="jquery.cookie.js"></script>
    <script type="text/javascript">
        $(function(){
            var toggle=$('.toggle');
            var inner=toggle.find('.inner');
            if($.cookie('divState')=='visible')
                inner.show();
            else
                inner.hide();
            toggle.find('a').click(function(){
                if(inner.is(':visible'))
                    $.cookie('divState', 'hidden');
                else
                    $.cookie('divState', 'visible');
                inner.toggle();
            });
        });
    </script>
    <style type="text/css">
        div
        {
            padding: 2px;
            border: 1px solid #ccc; width: 300px
        }
    </style>
</head>
<body>
    <div class="toggle">
        <a>Click me</a>
        <div class="inner">
            Some text <br />
            Some text <br />
            Some text <br />
            Some text <br />
            Some text <br />
            Some text <br />

        </div>
    </div>
</body>
</html>

单击“单击我”并多次更新页面-您将记住该 div 状态。它存储在 cookie 中。

如果不介意,我使用 jquery。我试图展示的只是工作流程。如果您不能使用 jquery,那么将示例转换为本机 javascript 非常容易。

现场演示 - http://jsfiddle.net/CQFJ4/

我希望这是有帮助的。

于 2012-12-24T17:51:31.153 回答
0

设置 cookie 很简单:

document.cookie="mydiv=block";

您可以在此处查看有关读取和擦除 cookie 的示例: http ://www.quirksmode.org/js/cookies.html

于 2012-12-24T15:03:15.503 回答