js设置cookie,读取cookie, 删除cookie,表单页跳转到其他页面,不清空表单的时候可以使用cookie保存数据

js设置cookie,读取cookie, 删除cookie,本地无效,需要用域名/ip访问才能设置

表单页跳转到其他页面,不清空表单的时候可以使用cookie保存数据

引用js.cookie.min.js

//设置cookie
Cookies.set('name', 'value', { expires: 7, path: '' });
Cookies.set('name', { foo: 'bar' });//json格式的数据

//读取cookie
Cookies.get('name');
Cookies.get();//全部cookie

//json格式的数据
Cookies.getJSON('name'); // => { foo: 'bar' }
Cookies.getJSON();

//删除cookie
Cookies.remove('name');

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>设置cookie</title>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js.cookie.min.js"></script>

<style type="text/css">
body{
    font-size:18px;
}
#cookieTips {
    display: none;
    position: fixed;
    width: 100%;
    min-height: 2em;
    line-height: 2em;
    bottom: 0;
    left: 0;
    right: 0;
    font-size: 0.9em;
    color: #fff;
    background-color: rgba(20,20,20,0.9);
    z-index: 9999;
}
.cookie-content {
    width: 100%;
}
#cookieTips .cookie-txt {
    width: 80%;
}
#cookie-button {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    padding: 4px 20px;
    color: #000;
    border: 0;
    font-size: 1em;
    line-height: 1;
    border-radius: 0;
    cursor: pointer;
    background-color: #fff;
}

</style>
</head>
<body>
<div id="cookieTips">
    <div class="col-full cookie-content">
        <div class="cookie-txt">
            <div id="text-7" class="widget widget_text">            
                <div class="textwidget"><p>若您选择继续浏览本网站,即表示您同意我们的<a style="text-decoration: underline; color: #fff;" href="#">条款和细则</a>、<a style="text-decoration: underline; color: #fff;" href="#">隐私政策</a>及同意我们使用Cookies。</p>
                </div>
            </div>
        </div>

        <div id="cookie-button">OK</div>
        
    </div>
</div>
<script type="text/javascript">

    if(Cookies.get('the-cookie-name')!="mycookie"){
        // console.log("不存在设置的cookie!");
        $("#cookieTips").css("display","block");
    }

    $("#cookieTips").on("click","#cookie-button",function(){
         //设置7天有效期
        Cookies.set('the-cookie-name','mycookie', { expires: 7 });
        $("#cookieTips").css("display","none");
    });
    
</script>
</body>
</html>

 

js设置cookie,读取cookie, 删除cookie,表单页跳转到其他页面,不清空表单的时候可以使用cookie保存数据

js设置cookie,读取cookie, 删除cookie,表单页跳转到其他页面,不清空表单的时候可以使用cookie保存数据