cookie介紹一個簡單的效果傳值

時間 2019-11-16

標籤 cookie 介紹一個簡單效果欄目 HTML 简体版

原文原文鏈接

首先來一個簡單的介紹

一個輕量級的cookie 插件，能夠讀取、寫入、刪除 cookie。
jquery.cookie.js 的配置
首先包含jQuery的庫文件，在後麪包含 jquery.cookie.js 的庫文件。html

使用方法

1.新添加一個會話 cookie：

$.cookie('the_cookie', 'the_value');
注：當沒有指明 cookie有效時間時，所建立的cookie有效期默認到用戶關閉瀏覽器爲止，因此被稱爲 jquery

「會話cookie（session cookie）」。瀏覽器

2.建立一個cookie並設置有效時間爲 7天:

$.cookie('the_cookie', 'the_value', { expires: 7 });
注：當指明瞭cookie有效時間時，所建立的cookie被稱爲「持久 cookie （persistent cookie）」。安全

3.建立一個cookie並設置 cookie的有效路徑：

$.cookie('the_cookie', 'the_value', { expires: 7, path: '/' });
注：在默認狀況下，只有設置 cookie的網頁才能讀取該 cookie。若是想讓一個頁面讀取另外一個頁面設 cookie

置的cookie，必須設置cookie的路徑。cookie的路徑用於設置可以讀取 cookie的頂級目錄。將這 session

個路徑設置爲網站的根目錄，能夠讓全部網頁都能互相讀取 cookie （通常不要這樣設置，防止出現衝突）。dom

4.讀取cookie：

$.cookie('the_cookie'); // cookie存在 => 'the_value'
$.cookie('not_existing'); // cookie不存在 => null函數

5.刪除cookie，經過傳遞null做爲cookie的值便可：

$.cookie('the_cookie', null);
----------相關參數的解釋--------------- 網站

1).expires: 365 編碼

定義cookie的有效時間，值能夠是一個數字（從建立cookie時算起，以天爲單位）或一個Date 對

象。若是省略，那麼建立的cookie是會話cookie，將在用戶退出瀏覽器時被刪除。

2).path: '/'

默認狀況：只有設置cookie的網頁才能讀取該cookie。

定義cookie的有效路徑。默認狀況下，該參數的值爲建立 cookie 的網頁所在路徑（標準瀏覽器的行爲）。

若是你想在整個網站中訪問這個cookie須要這樣設置有效路徑：path: '/'。若是你想刪除一個定義

了有效路徑的 cookie，你須要在調用函數時包含這個路徑:$.cookie('the_cookie', null,

{ path: '/' });。 domain: 'example.com'

默認值：建立 cookie的網頁所擁有的域名。

3).secure: true

默認值：false。若是爲true，cookie的傳輸須要使用安全協議（HTTPS）。

4).raw: true

默認值：false。

默認狀況下，讀取和寫入 cookie 的時候自動進行編碼和解碼（使用encodeURIComponent 編碼，

decodeURIComponent 解碼）。要關閉這個功能設置 raw: true 便可。

<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="UTF-8">
<title>隱藏</title>
<style>
    body{
        margin:0px; 
    }
    .ying{
        
        background:#000;
    }
    .cang{
        position: relative;
    }
    .cang a{
        display: block;
        height:80px;
        background: url("images/9.jpg") no-repeat 50% 0;
    }

    @media screen and (max-width: 1200px) {
        .cang a{
        background: url("images/01.jpg") no-repeat 50% 0;
        }
        
    }
    .ca{
        height: 20px;
        width: 20px;
        background: rgb(45,45,45);
        cursor: pointer;
        position: absolute;
        right: 100px;
        top: 5px;
        font-weight: bold;
        font-size: 14px;
        color: #FFF;
        opacity: .3;
        text-align: center;
    }
</style>

</head>
<body>

<div class="ying">
    <div class="cang">
        <a href="#">
            <div class="ca">
                <span>x</span>
            </div>
        </a>
    </div>
</div>
<script src="js/jquery1.8.3.min.js"></script>
<script src="js/cookei.js"></script>
<script>
        function  detectDevice(){
            var cang=screen.availWidth;
            if(cang>1200){
                $("html").addClass("desktop");
            }
        }
         detectDevice();


         function caAd(){
             $(".ca").click(function(){
             $(".ying").fadeOut("show");
             setCookie("isCa","1",1)
             });

             if(!getCookie("isCa")){
                 $(".ying").show();
             }
         
         }
        
         caAd();
</script>

</body></html>

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。