js保存,获取,删除cookie的操作

【转】来自:http://blog.csdn.net/itmyhome1990/article/details/7363816

JSP表单页面

[html] view plaincopy
 
  1. <form action="login" method="post">  
  2.                 用户名:<input type="text" name="username" id="username" /><br>  
  3.                 密码:<input type="password" name="password" /><br />  
  4.                 <input type="checkbox" id="remember" checked="checked">  
  5.                 记住用户名<input type="submit" value="登录" id="sub" />  
  6.             </form>  


JS操作cookie

[javascript] view plaincopy
 
  1. <script type="text/javascript">  
  2.     $(document).ready(function() {  
  3.             var name = getCookie("username");  
  4.             //$("#username")[0].value=name;   
  5.             $("#username").val(name);  
  6.   
  7.             /* 
  8.             * 当点击登录按钮时 判断是否勾选记住用户名  
  9.             * 如果勾选  则将用户名保存在Cookie中 否则删除  
  10.             */  
  11.             $("#sub").click(function() {  
  12.                 if ($("#remember").attr("checked") == true) {  
  13.                     //获得用户名   
  14.                     var username = $("#username").val();  
  15.                     //设置cookie  
  16.                     setCookie("username", username);  
  17.                 } else {  
  18.                     //删除cookie  
  19.                     delCookie("username")   
  20.                 }  
  21.             })  
  22.             function setCookie(name, value) {  
  23.                 var Days = 60; //cookie 将被保存两个月   
  24.                 var exp = new Date(); //获得当前时间   
  25.                 exp.setTime(exp.getTime() + Days * 24 * 60 * 60 * 1000); //换成毫秒  
  26.                 document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString();  
  27.             }  
  28.             function getCookie(name) {  
  29.                 //取出cookie   
  30.                 var strCookie = document.cookie;  
  31.                 //cookie的保存格式是 分号加空格 "; "  
  32.                 var arrCookie = strCookie.split("; ");  
  33.                 for ( var i = 0; i < arrCookie.length; i++) {  
  34.                     var arr = arrCookie[i].split("=");  
  35.                     if (arr[0] == "username") {  
  36.                         return arr[1];  
  37.                     }  
  38.                 }  
  39.                 return "";  
  40.             }  
  41.             function delCookie(name) {  
  42.                 var exp = new Date(); //当前时间   
  43.                 exp.setTime(exp.getTime() - 1); //删除cookie 只需将cookie设置为过去的时间    
  44.                 var cval = getCookie(name);  
  45.                 if (cval != null)  
  46.                     document.cookie = name + "=" + cval + ";expires="+ exp.toGMTString();  
  47.             }  
  48.         })  
  49. </script>  


cookie简单介绍

cookie是浏览器提供的一种机制,它将document对象的cookie属性提供给javascript。可以由javascript对起进行控制

而并不是javascript本身的性质。cookie是存于用户硬盘的一个文件,这个文件通常对应于一个域名,当浏览器再次

访问这个域名时,便使这个cookie可用。因此,cookie可以跨越一个域名下的多个网页,但不能跨越多个域名使用。

cookie机制将信息存储于用户硬盘,因此可以作为全局变量,这是它最大的一个优点。它可以用于以下几种场合。

(1) 保存用户登录状态

(2) 跟踪用户行为

(3) 定制页面

(4) 创建购物车

设置cookie

 每个cookie都是一个名/值对,可以把下面这样一个字符串赋值给document.cookie

document.cookie="username=zhangsan";

如果要一次存储多个名/值对,可以使用分号加空格(;  )隔开,例如:

document.cookie="username=zhangsan;  password=123";

在cookie 的名或值中不能使用分号(;)、逗号(,)、等号(=)以及空格。在cookie的名中做到这点很容易,但要保存的值是不确定的。如何来存储这些值呢?方 法是用escape()函数进行编码,它能将一些特殊符号使用十六进制表示,例如空格将会编码为“20%”,从而可以存储于cookie值中,而且使用此 种方案还可以避免中文乱码的出现。

给cookie设置终止日期

到现在为止,所以的cookie都是单会话cookie,即浏览器关闭后这些cookie将会丢失。

在实际开发中,cookie常常需要长期保持,例如保存用户登录的状态,可以用下面的选项来实现:

document.cookie="username=zhangsan; expiress=GMT_String";

其中GMT_String是以GMT格式表示的时间字符串,这条语句就是将username这个cookie设置为GMT_String

表示的过期时间,超过这个时间,cookie将消失,不可访问

原文地址:https://www.cnblogs.com/jixu8/p/3497730.html