javascript cookie示例代码

最新推荐文章于 2023-02-25 18:48:16 发布

西北无影脚

最新推荐文章于 2023-02-25 18:48:16 发布

阅读量356

点赞数

分类专栏：前端

前端专栏收录该内容

2 篇文章 0 订阅

订阅专栏

一：javascript cookie演示

1：index.html

<!DOCTYPE html>

<html>
	<head> 
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
		<title>Cookie</title> 
	<style type="text/css"> 
		#welcome h3 
		{ 
		font-weight:normal; 
		color:#ff0000; 
		} 
	</style>
	 
	<script type="text/javascript" src="cookie.js"></script> 
	<script type="text/javascript">
		//---------------使用cookie---------------------- 
		function useCookie() 
		{ 
			var username=getCookie("username"); 
			if(username!=null){ 
				document.getElementById('welcome').innerHTML="<h3>欢迎您,"+username+"</h3>"+"<button οnclick='delusr();'>删除用户名</button>"; 
			}else{ 
				var str="<h3>欢迎您,游客!</h3>"+ 
				  "<input id='usrname' type='text' />"+ 
				  "<button id='saveusr' οnclick='checksave();'>保存用户名</button>"; 
				document.getElementById('welcome').innerHTML=str; 
				} 
		} 

		function checksave() 
		{ 
			var el=document.getElementById('usrname'); 
			if(el.value){ 
				setCookie("username",el.value); 
				location.reload();//刷新页面 
			} 
			else 
				alert("输入框不能为空"); 
		} 

		function delusr() 
		{ 
			delCookie("username"); 
			location.reload(); 
		} 
	</script> 
	</head> 
	<body οnlοad="useCookie();"> 
		<div id="welcome"> 
		</div> 
	</body> 
</html>

2：cookie.js

//设置cookie 
function setCookie(NameOfCookie, value, expiredays) 
{ 
	//@参数:三个变量用来设置新的cookie: 
	//cookie的名称,存储的Cookie值, 
	// 以及Cookie过期的时间. 
	// 这几行是把天数转换为合法的日期
	var ExpireDate = new Date (); 
	ExpireDate.setTime(ExpireDate.getTime() + (expiredays * 24 * 3600 * 1000)); 

	// 下面这行是用来存储cookie的,只需简单的为"document.cookie"赋值即可. 
	// 注意日期通过toGMTstring()函数被转换成了GMT时间。
	document.cookie = NameOfCookie + "=" + escape(value) + 
		((expiredays == null) ? "" : "; expires=" + ExpireDate.toGMTString()); 
} 

//获取cookie值 
function getCookie(NameOfCookie) 
{ 

	// 首先我们检查下cookie是否存在. 
	// 如果不存在则document.cookie的长度为0 
	if (document.cookie.length > 0) 
	{ 

		// 接着我们检查下cookie的名字是否存在于document.cookie 

		// 因为不止一个cookie值存储,所以即使document.cookie的长度不为0也不能保证我们想要的名字的cookie存在 
		//所以我们需要这一步看看是否有我们想要的cookie 
		//如果begin的变量值得到的是-1那么说明不存在
		begin = document.cookie.indexOf(NameOfCookie+"="); 
		if (begin != -1)    
		{ 

			// 说明存在我们的cookie. 
			begin += NameOfCookie.length+1;//cookie值的初始位置 
			end = document.cookie.indexOf(";", begin);//结束位置 
			if (end == -1) end = document.cookie.length;//没有;则end为字符串结束位置 
			return unescape(document.cookie.substring(begin, end)); 
		} 
	} 

	return null; 

	// cookie不存在返回null 
} 

//删除cookie 
function delCookie (NameOfCookie) 
{ 
	// 该函数检查下cookie是否设置，如果设置了则将过期时间调到过去的时间; 
	//剩下就交给操作系统适当时间清理cookie啦 
	if (getCookie(NameOfCookie)) { 
		document.cookie = NameOfCookie + "=" + "; expires=Thu, 01-Jan-70 00:00:01 GMT"; 
	} 
}

二：参考资料

http://blog.csdn.net/liuyong0818/article/details/4807473

西北无影脚

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript cookie示例代码

一：javascript cookie演示1：index.html Cookie #welcome h3 { font-weight:normal; color:#ff0000; } //---------------使用cookie---------------------- function
复制链接

扫一扫