$.cookie()
Cookie
瀏覽器 (browser) 的 cookie 可以用來儲存一些使用者的連線資料,例如儲存使用者登入狀態的 session 資料。cookie 會一直儲存在使用者的瀏覽器中,直到你指定的失效日期為止,不論 server 端或使用者 (瀏覽器) 端都可以讀取和寫入 cookie 資料。
CDN
相關連結 : https://cdnjs.com/libraries/jquery-cookie
<!--cookie-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"
integrity="sha512-3j3VU6WC5rPQB4Ld1jnLV7Kd5xr+cq9avvhwqzbH/taCRNURoeEpoPBK9pDyeukwSxwRPJ8fDgvYXd6SkaZ2TA=="
crossorigin="anonymous"></script>
<!--jQuery-->
<script
src="https://code.jquery.com/jquery-3.5.1.js"
integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc="
crossorigin="anonymous"></script>
使用方式
參考教學:https://www.runoob.com/jquery/jquery-cookie-plugin.html

創建Cookie
$.cookie('CookieName','CookieValue');
如同上方意思,使用方式先取cookie的名稱在設定此名稱的值。
EX: $.cookie('name', '123');//在此cookie的name為123
時效Cookie
$.cookie('name', 'value', { expires: 10 });
假設要設定10天候失效,就需要外加個 {expires: 10} 。
讀取Cookie
$.cookie('CookieName');/*讀取CookieName的內容*/
$.cookie();/*讀取全部的Cookies的訊息*/
刪除Cookie
$.removeCookie('CookieName')/*刪除CookieName的訊息*/
檢查Cookie
最後,確認Cookie的值變成怎樣的方式有很多,以下提供參考:
可以使用F12檢查裡面的Cookie值,若沒出現可能需要使用 ctrl+F5
使否是載入畫面的問題。

範例-簡易登入訊息
$.cookie('userName','admin');
$.cookie('userPwd','0000');
$('input[type="submit"]').on('click',function(){
if($('#usr_password').val()==$.cookie('userPwd') &&
$('#usr_code').val()==$.cookie('userName')){
alert('Welcome');
$.removeCookie('userName');
$.removeCookie('userPwd');
}
})
Last updated
Was this helpful?