Question

我想要添加到网站的下拉消息，它使用以下代码

<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才能做到这一点，但是没有任何关于他们的线索任何帮助赞赏

提前感谢Ash

Answer 1

试试这个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>

注意：此代码未经过测试，可能无效。但它会给你一个正确方向的暗示。

Answer 2

您不一定需要使用cookie;您可以尝试使用store.js来存储数据，{{3}}封装浏览器本地存储以及一些其他方法来在客户端存储数据。

/*
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-->

$(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);
   });

});

如何记住用户是否已关闭下拉列表div

2 个答案: