2012-06-01 19 views
1

我有一點點的下拉消息我想添加到一個站點,它使用下面的代碼如何記住,如果用戶已關閉下拉DIV

<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來做到這一點,但沒有關於他們的線索任何幫助,提前感謝

感謝阿什

回答

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

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

}); 
+0

好吧,那麼如何實施此解決方案,必須有一個簡單的方法,一次用戶已經點擊了這裏的鏈接與id隱藏它記得它 –

+0

恐怕我的JavaScript很差,但我發現我的自我在我需要使用它的情況 –

+0

我在這裏爲您創建了一個簡單的jsFiddle http://jsfiddle.net/sQEtq/ –

3

試試這個jQuery插件:https://github.com/carhartl/jquery-cookie這是一個簡單的,輕量級的jQuery插件閱讀,寫作和刪除cookies。

你可以簡單地創建餅乾

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

而且閱讀餅乾

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

所以你要求它...

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

CSS

#someid1 { 
    display:none; 
} 

#someid1.open { 
    display:block 
} 

例Implemtation

<!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> 

注:此代碼沒有經過測試和可能不工作。但它給了你一個正確方向的暗示。

+0

謝謝你,我會嘗試一下,儘快給您 –

+0

我將下面的代碼添加到我的文檔中工作。我不明白說the_cookie和the_value,我的意思是改變這一點,如果是的話,是什麼?

+0

我希望我像往常一樣缺少點 –