1

我有一个小下拉消息要添加到站点，它使用以下代码

<script>$(document).ready(function(){
$('#someid1') .slideDown('slow');}); $(document).ready(function() $('#hide').click(function(){
 $('#someid1').slideUp('slow'); });});</script>


<div id="someid1"><div id="someid2">some gibberish <a id="hide" href="#">HERE</a></div></div>

当用户点击这里隐藏我想记住这个选择。问题是我知道我可能需要一个 cookie 来执行此操作，但对它们一无所知，任何帮助表示赞赏

提前感谢灰

4

2 回答 2

3

试试这个 jQuery 插件：https ://github.com/carhartl/jquery-cookie这是一个简单、轻量级的 jQuery 插件，用于读取、写入和删除 cookie。

您可以简单地创建Cookie

$.cookie('the_cookie', 'the_value');

并阅读Cookie

$.cookie('the_cookie'); // => 'the_value'

所以你要求...

if ($.cookie('the_cookie') === 'the_value') {
    $('#someid1').addClass('open');
}

CSS

#someid1 {
    display:none;
}

#someid1.open {
    display:block
}

示例实现

<!DOCTYPE HTML>
<html lang="en-US">
    <head>
        <meta charset="UTF-8">
        <title></title>

        <!-- Get jQuery Core -->
        <script src="/path/to/jquery.js" type="text/javascript"></script>

        <!-- Get Cookie Plugin -->
        <script src="/path/to/jquery.cookie.js" type="text/javascript"></script>


        <script type="text/javascript">

            // Is DOM ready?
            $(document).ready(function() {

                $('#hide').click(function(e){

                    // Set Cookie named 'notification'to the value 'hide'
                    $.cookie('notification', 'hide'); 

                    // Hide your Div
                    $('#someid1').slideUp('slow');

                    // Disable default behavior
                    e.preventDefault();
                });

                // Hide DIV is Cookie is Set
                if( $.cookie('notification') === 'hide' ){
                    $('#someid1').hide();
                }

            });
        </script>

    </head>
    <body>
        <div id="someid1">

            <div id="someid2">some gibberish</div>
            <a id="hide" href="#">HERE</a>

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

注意：此代码未经测试，可能无法正常工作。但它会给你一个正确方向的提示。

于 2012-06-01T13:37:27.980 回答
2

您不一定需要使用 cookie；您可以尝试使用store.js存储数据，它封装了浏览器本地存储和其他一些在客户端存储数据的方法。

/*
store.js groups your values into something called a store. Multiple stores are separated from each other.
So let's make a new store:
*/

var settings = new Store("settings");

/*
Just choose a name for the new store, and save it in a variable. Always remember to use the "new" keyword! Never leave it off!
Now you can almost normally get, set and remove values:
*/

settings.set("color", "blue");
settings.set("enable_test1", true);
settings.set("number_of_rainbows", 8);

// and

var color = settings.get("color");

// and

settings.remove("color");

...用代码编辑..

 <div id="cookiemsg"><div id="cookiecenter"><p>This website places a
 Google Analytics cookie on your machine, this helps us collect
 anonymous information so that we can provide a better experiance for
 you. By using this site you imply your consent to this. For more
 information or to find out how you can remove this cookie please visit
 our privacy policy <a href="#">HERE</a> or if you are happy with this
 click <a id="hide" href="#">HERE</a></p></div><!--end of
 cookiecenter--></div><!--end of cookiemsg-->

​</p> 

$(function(){
    var store = new Store("com.domain.page.store")
    var acceptedCookie = store.get("acceptedCookie");
    if(typeof acceptedCookie == "undefined"){
     //set a default
       acceptedCookie = false
     }
    if(!acceptedCookie){
        $('#cookiemsg').slideDown('slow');
    }

    $('#hide').click(function(){
         $('#cookiemsg').slideUp('slow');
         store.set("acceptedCookie", true);
   });

});
于 2012-06-01T14:46:08.203 回答