`
itmyhome
  • 浏览: 97448 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

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

 
阅读更多

JSP表单页面

<form action="login" method="post">
				用户名:<input type="text" name="username" id="username" /><br>
				密码:<input type="password" name="password" /><br />
				<input type="checkbox" id="remember" checked="checked">
				记住用户名<input type="submit" value="登录" id="sub" />
			</form>


JS操作cookie

<script type="text/javascript">
	$(document).ready(function() {
		    var name = getCookie("username");
		    //$("#username")[0].value=name; 
			$("#username").val(name);

			/*
			* 当点击登录按钮时 判断是否勾选记住用户名 
			* 如果勾选  则将用户名保存在Cookie中 否则删除 
			*/
			$("#sub").click(function() {
				if ($("#remember").attr("checked") == true) {
					//获得用户名 
					var username = $("#username").val();
					//设置cookie
					setCookie("username", username);
				} else {
					//删除cookie
					delCookie("username") 
				}
			})
			function setCookie(name, value) {
				var Days = 60; //cookie 将被保存两个月 
				var exp = new Date(); //获得当前时间 
				exp.setTime(exp.getTime() + Days * 24 * 60 * 60 * 1000); //换成毫秒
				document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString();
			}
			function getCookie(name) {
			    //取出cookie 
				var strCookie = document.cookie;
				//cookie的保存格式是 分号加空格 "; "
				var arrCookie = strCookie.split("; ");
				for ( var i = 0; i < arrCookie.length; i++) {
					var arr = arrCookie[i].split("=");
					if (arr[0] == "username") {
						return arr[1];
					}
				}
				return "";
			}
			function delCookie(name) {
				var exp = new Date(); //当前时间 
				exp.setTime(exp.getTime() - 1); //删除cookie 只需将cookie设置为过去的时间  
				var cval = getCookie(name);
				if (cval != null)
					document.cookie = name + "=" + cval + ";expires="+ exp.toGMTString();
			}
		})
</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将消失,不可访问

分享到:
评论

相关推荐

    Javascript Cookie操作类的封装

    本文将详细讲解如何封装一个Cookie操作类,实现对Cookie的增删改查功能。 首先,理解Cookie的基本概念是必要的。Cookie是由服务器端发送到浏览器并保存在本地的一个小文本文件,它由键值对组成,每个键值对之间用...

    jquery 设置cookie、删除cookie、获取cookie

    在前端开发中,通过 JavaScript 操作 Cookie 是一种常见的需求,尤其是为了实现用户状态的持久化存储或网站配置的保存等场景。jQuery 提供了一个非常方便的方式来处理这些操作,本文将详细介绍如何利用 jQuery 和其...

    前端Cookie工具,获取Cookie数据,获取Cookie数据key名称,清除站点所有Cookie数据

    本文将深入探讨如何使用JavaScript来操作Cookie,包括获取Cookie数据、获取Cookie数据的key名称以及清除站点所有Cookie数据的方法。 首先,我们要了解Cookie的基本概念。Cookie是由服务器端设置并在客户端存储的一...

    CookiesjsJavaScript客户端的Cookie操作库

    "Cookies.js - JavaScript 客户端的Cookie操作库" 进一步明确了这个库是Cookies.js,它是专门为JavaScript开发设计的,主要功能是在用户浏览器上执行Cookie的相关操作。作为客户端库,它使得开发者无需后端服务器...

    javascript cookie 操作框架 XCookie

    JavaScript Cookie 操作框架 XCookie 是一个用于方便地管理和操作浏览器cookies的工具,它简化了JavaScript中处理cookie的复杂性。在Web开发中,cookies经常被用来存储用户状态、会话信息或其他临时数据,而XCookie...

    JS保存和删除cookie操作 判断cookie是否存在

    接着,文章介绍了使用JavaScript保存和删除Cookie的方法。保存Cookie可以使用以下函数: ```javascript function addCookie(objName, objValue, objHours) { var str = objName + "=" + escape(objValue); if ...

    js操作cookie.pdf

    以上知识点详细地介绍了如何通过JavaScript操作Cookie,包括Cookie的基础概念,如何读取、设置、删除Cookie,以及在服务器端(ASP、PHP)如何操作Cookie。同时也涉及到Cookie的一些高级特性,如编码、安全性和存储...

    一个简单的cookie操作类

    本篇文章介绍了一个JavaScript实现的简单Cookie操作类,该类提供了一系列方法来帮助开发者管理用户的Cookie。 #### 二、开发信息 - **开发时间**:05.10(具体年份未给出) - **开发者**:来源于网络,由CMJ进行了...

    js操作cookie(增删改查)

    这篇博客“js操作cookie(增删改查)”可能详细讲解了如何使用JavaScript进行Cookie的添加、删除、修改和查询操作。虽然没有提供具体的内容,但我可以为你提供一个通用的教程来介绍这些基本概念。 1. **添加Cookie*...

    JS操作Cookie 大全

    ### JS操作Cookie 大全 ...通过以上介绍可以看出,JavaScript中的Cookie操作对于实现用户会话管理、个性化推荐等功能非常重要。掌握了这些基础知识后,开发者可以更灵活地使用这些技术来提升用户体验。

    JavascriptCookie一个轻量级别的浏览器端cookie操作的库

    总的来说,JavaScript Cookie库是前端开发中处理浏览器cookie操作的一个高效选择,尤其适用于需要在多个页面间保持用户状态或简单数据存储的场景。通过灵活的API和丰富的配置选项,可以方便地集成到任何JavaScript...

    js操作cookie

    本文将深入探讨JavaScript如何操作Cookie,包括设置、获取、删除Cookie,并通过一个具体的例子——t2.html文件来阐述其实践过程。 ### 一、Cookie的基本概念 Cookie由服务器生成并发送到客户端(浏览器),浏览器...

    java和js中cookie的相关操作.docx

    以下是对这两个语言中Cookie操作的详细解释: 1. **Java 中设置 Cookie**: - 创建 `Cookie` 对象并指定键值对,如 `Cookie cookie = new Cookie("key", "value")`。 - 设置 Cookie 的生存期,`setMaxAge(int ...

    js做的cookie记忆功能

    在这个场景中,我们讨论的是如何使用JavaScript实现一种基于cookie的记忆功能,以便在用户使用AJAX提交表单后,能够保存并恢复他们的输入,避免重复录入。这在网页应用中非常常见,比如搜索引擎的历史记录功能,就像...

    使用Cookie记录用户名和密码

    在编程实现上,对于Java开发者,可以使用HttpServletResponse的addCookie()方法来设置Cookie,而对于前端JavaScript,可以使用document.cookie接口来操作Cookie。对于Python的Flask或Django框架,也有相应的库函数...

    jquery下的cookie.js文件

    jQuery.cookie.js主要依赖于Document.cookie接口,这是一个内置的JavaScript属性,用于设置和获取Cookie。但由于其原始API限制较多,如不支持跨域、最大长度限制等,jQuery.cookie.js进行了封装,解决了这些问题。它...

    javascript针对cookie的基本操作实例详解.docx

    以上内容详细介绍了JavaScript针对Cookie的基本操作方法,包括设置、获取和删除Cookie的具体实现细节,以及一些扩展功能的思考。通过这些技巧,开发者可以更好地管理和利用Cookie,以提高Web应用程序的功能性和用户...

    java和js中cookie的相关操作.pdf

    在JavaScript中,通过操作document.cookie字符串来获取、设置或删除cookie是常见的实践。 最后,对于Java Web应用容器如Tomcat、Jetty等,它们提供了对cookie操作的支持,并允许开发者在这些容器提供的环境下操作...

    JS使用cookie保存用户登录信息操作示例

    这篇教程主要讲解了如何使用JavaScript操作Cookie来保存用户登录信息。以下是对这个话题的详细阐述: 首先,理解Cookie的基本概念。Cookie是由服务器端发送到浏览器,并由浏览器保存的一小段文本信息。当浏览器再次...

    jquery.cookie.js 以及用法 cookie读取与存储

    总结,`jquery.cookie.js`简化了JavaScript对Cookie的操作,使得在Web应用中管理用户数据变得更加便捷。然而,随着Web Storage(localStorage和sessionStorage)以及IndexedDB等现代存储技术的出现,对于大量数据或...

Global site tag (gtag.js) - Google Analytics