如何利用js操作cookie实现记住密码功能
展开全部
【什么是cookie】
“cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时，就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值。”
不同的浏览器可能对cookie的储存方式不同，但是相同的是cookie中的内容都是保存在客户一端的。（session是保存在服务器上的）
【cookie的几点注意】
说的通俗一点，cookie就是一个字符串（这点可以用alert(typeof document.cookie)来验证），用来保存一些客户信息。
程序员可以对其写入任何想写入的东西，只要不超过cookie的大小限制（4kb）。
cookie的操作办法最简单的说法就是对document.cookie进行操作（写入你要需保存的内容）。
cookie有一个关键字是expires，它是用来设置cookie的有效期的，默认情况（不设置expires）是当浏览器关闭的时候，自动清除cookie。
一般来说，cookie的形式都是这样的："cookieName1=cookie1;cookieName2=cookie2;expires=" + date，这里需要注意几点：
1.注意分号
";expires="之前的字符串你可以随便写，但是";expires="必须遵循这个写法，尤其是这个分号不能少，不然浏览器是认不出你的expires（过期时间），而把它当成cookie内容的一部分。
例如：
如果你写成
1 <html>
2 <head>
3 <script type="text/javascript">
4 var date = new Date();
5 date.setDate(date.getDate() + 10); //date设置为十天之后
6 document.cookie = "username=findingsea^password=123^expires=" + date.toGMTString(); //toGMTString方法将date转换成格林尼治时间格式
7 </script>
8 </head>
9 <body>
10
11 </body>
12 </html>
打开firefox下的选项-->隐私-->删除私人Cookie
可以到cookie过期的时间为当前会话结束时，也就是浏览器关闭的时候。换而言之，就是我们设置的expires完全没有起作用。
要fix也很容易，只要在上段代码中，在expires前加一个分号，也就是改成"...^;expires="，重新运行firefox查看cookie
可以看到过期时间为10之后（今天是2012年8月31日），expires设置成功，所以说分号很重要，很重要！！！
2.如何清除cookie
其实清除cookie这种说法是不准确的，应该是说让cookie过期。因为不能直接对cookie置空，（如果以为document.cookie=""，这样就能清空cookie，我只能说少年你还是太天真了），而使cookie的方法也很简单，就是设置expires。我们可以把expires设置到很久以后，让cookie能长期保存，那同样我们也能把cookie设置到过去，让cookie马上过期。这个“过去”就是1970年1月1号，我们将expires设置到这个时间，cookie就过期了。至于为什么是这个时间，请参考关于1970-1-1 00:00.000的知识 。
3.如何设置和获取cookie
<在一条cookie中设置多个变量>
JavaScript没有提供根据cookie名来获取cookie值的方法。上面已经讲过了，document.cookie只是一个字符串而已，我们就对其进行字符串解析即可。要在获取的时候进行解析，就要需要在设置的时候设置标识符，这里需要注意的点和第一点刚好相反，在第一点中，我们是千叮咛万嘱咐不要忘记分号，而且在设置标识符的时候，我建议尽量不要用分号当做分隔符，我们来看一下对比；
代码1：
1 <html>
2 <head>
3 <script type="text/javascript">
4 var date = new Date();
5 date.setDate(date.getDate() + 10);
6 document.cookie = "username=findingsea;password=123;expires=" + date.toGMTString();
7 </script>
8 </head>
9 <body>
10
11 </body>
12 </html>
代码2：
1 <html>
2 <head>
3 <script type="text/javascript">
4 var date = new Date();
5 date.setDate(date.getDate() + 10);
6 document.cookie = "username=findingsea^password=123^;expires=" + date.toGMTString();
7 </script>
8 </head>
9 <body>
10
11 </body>
12 </html>
可以很清楚地看到，代码1中的password=123都“吞掉了”，造成这个现象的原因是，浏览器在保存cookie的时候，在读到分号之后，就认为cookie的内容结束了，浏览器理想的cookie形式是"cookieName=cookie;expires=date"，但是显然我们并不满足这样，所以要在一条cookie中设置多个值，就需要像代码2这样用标示符（不要分号）进行分割。然后在读取的时候，也根据标示符进行逐个读取。
<设置多个cookie>
当然当然当然，以上是正对相对复杂的需要我们在同一条cookie中设置多个变量的情况，更规范的情况是一条cookie就储存一个对象。不过这样的话，你的cookie就要占用更多的空间（相比于一条cookie中设置多个变量而已，因为你需要为每个cookie都设置一个expires）。不过这样的操作更加简单和规范，推荐在变量少的情况下使用。
“cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时，就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值。”
不同的浏览器可能对cookie的储存方式不同，但是相同的是cookie中的内容都是保存在客户一端的。（session是保存在服务器上的）
【cookie的几点注意】
说的通俗一点，cookie就是一个字符串（这点可以用alert(typeof document.cookie)来验证），用来保存一些客户信息。
程序员可以对其写入任何想写入的东西，只要不超过cookie的大小限制（4kb）。
cookie的操作办法最简单的说法就是对document.cookie进行操作（写入你要需保存的内容）。
cookie有一个关键字是expires，它是用来设置cookie的有效期的，默认情况（不设置expires）是当浏览器关闭的时候，自动清除cookie。
一般来说，cookie的形式都是这样的："cookieName1=cookie1;cookieName2=cookie2;expires=" + date，这里需要注意几点：
1.注意分号
";expires="之前的字符串你可以随便写，但是";expires="必须遵循这个写法，尤其是这个分号不能少，不然浏览器是认不出你的expires（过期时间），而把它当成cookie内容的一部分。
例如：
如果你写成
1 <html>
2 <head>
3 <script type="text/javascript">
4 var date = new Date();
5 date.setDate(date.getDate() + 10); //date设置为十天之后
6 document.cookie = "username=findingsea^password=123^expires=" + date.toGMTString(); //toGMTString方法将date转换成格林尼治时间格式
7 </script>
8 </head>
9 <body>
10
11 </body>
12 </html>
打开firefox下的选项-->隐私-->删除私人Cookie
可以到cookie过期的时间为当前会话结束时，也就是浏览器关闭的时候。换而言之，就是我们设置的expires完全没有起作用。
要fix也很容易，只要在上段代码中，在expires前加一个分号，也就是改成"...^;expires="，重新运行firefox查看cookie
可以看到过期时间为10之后（今天是2012年8月31日），expires设置成功，所以说分号很重要，很重要！！！
2.如何清除cookie
其实清除cookie这种说法是不准确的，应该是说让cookie过期。因为不能直接对cookie置空，（如果以为document.cookie=""，这样就能清空cookie，我只能说少年你还是太天真了），而使cookie的方法也很简单，就是设置expires。我们可以把expires设置到很久以后，让cookie能长期保存，那同样我们也能把cookie设置到过去，让cookie马上过期。这个“过去”就是1970年1月1号，我们将expires设置到这个时间，cookie就过期了。至于为什么是这个时间，请参考关于1970-1-1 00:00.000的知识 。
3.如何设置和获取cookie
<在一条cookie中设置多个变量>
JavaScript没有提供根据cookie名来获取cookie值的方法。上面已经讲过了，document.cookie只是一个字符串而已，我们就对其进行字符串解析即可。要在获取的时候进行解析，就要需要在设置的时候设置标识符，这里需要注意的点和第一点刚好相反，在第一点中，我们是千叮咛万嘱咐不要忘记分号，而且在设置标识符的时候，我建议尽量不要用分号当做分隔符，我们来看一下对比；
代码1：
1 <html>
2 <head>
3 <script type="text/javascript">
4 var date = new Date();
5 date.setDate(date.getDate() + 10);
6 document.cookie = "username=findingsea;password=123;expires=" + date.toGMTString();
7 </script>
8 </head>
9 <body>
10
11 </body>
12 </html>
代码2：
1 <html>
2 <head>
3 <script type="text/javascript">
4 var date = new Date();
5 date.setDate(date.getDate() + 10);
6 document.cookie = "username=findingsea^password=123^;expires=" + date.toGMTString();
7 </script>
8 </head>
9 <body>
10
11 </body>
12 </html>
可以很清楚地看到，代码1中的password=123都“吞掉了”，造成这个现象的原因是，浏览器在保存cookie的时候，在读到分号之后，就认为cookie的内容结束了，浏览器理想的cookie形式是"cookieName=cookie;expires=date"，但是显然我们并不满足这样，所以要在一条cookie中设置多个值，就需要像代码2这样用标示符（不要分号）进行分割。然后在读取的时候，也根据标示符进行逐个读取。
<设置多个cookie>
当然当然当然，以上是正对相对复杂的需要我们在同一条cookie中设置多个变量的情况，更规范的情况是一条cookie就储存一个对象。不过这样的话，你的cookie就要占用更多的空间（相比于一条cookie中设置多个变量而已，因为你需要为每个cookie都设置一个expires）。不过这样的操作更加简单和规范，推荐在变量少的情况下使用。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
Storm代理
2023-07-25 广告
StormProxies是一家可靠的代理服务提供商，提供原生IP（住宅原生IP）和高匿名代理服务。以下是关于StormProxies的原生IP服务的一些信息：1. 住宅原生IP：StormProxies提供的住宅原生IP是指从真实的家庭或企...
点击进入详情页
本回答由Storm代理提供
展开全部
<script language="javascript" type="text/javascript">
function checkInCorrect() //判断用户名和密码是否为空
{
if (document.getElementById('txtUserName').value=="")
{
alert('请输入用户名！')
document.getElementById('txtUserName').focus();
return false
}
if (document.getElementById('txtPassword').value=="")
{
alert('请输入密码！')
document.getElementById('txtPassword').focus();
return false
}
else
{
saveInfo();
return true;
}
}
saveInfo = function(){
try{
var isSave = document.getElementById('chkRememberPwd').checked; //保存按键是否选中
if (isSave) {
var usernm = document.getElementById('txtUserName').value;
var userpsw = document.getElementById('txtPassword').value;
if(usernm!="" && userpsw!=""){
SetCookie(usernm,userpsw);
}
}else {
SetCookie("","");
}
}catch(e){
}
}
function SetCookie(usern,psw){
var Then = new Date()
Then.setTime(Then.getTime() + 1866240000000)
document.cookie ="username=" + usern + "%%"+psw+";expires="+ Then.toGMTString() ;
}
function GetCookie(){
var nmpsd;
var nm;
var psd;
var cookieString = new String(document.cookie)
var cookieHeader = "username="
var beginPosition = cookieString.indexOf(cookieHeader)
cookieString = cookieString.substring(beginPosition);
var ends=cookieString.indexOf(";");
if (ends!=-1){
cookieString = cookieString.substring(0,ends);
}
if (beginPosition>-1){
nmpsd = cookieString.substring(cookieHeader.length);
if (nmpsd!=""){
beginPosition = nmpsd.indexOf("%%");
nm=nmpsd.substring(0,beginPosition);
psd=nmpsd.substring(beginPosition+2);
document.getElementById('txtUserName').value=nm;
document.getElementById('txtPassword').value=psd;
if(nm!="" && psd!=""){
document.forms[0].checkbox.checked = true
}
}
}
}
</script>
</head>
<body onLoad="document.getElementById('txtUserName').focus();GetCookie();">
<form>
用户名:<input type="text" ID="txtUserName" onblur="GetPwdAndChk()"> <br>
密 码:<input type="password" ID="txtPassword"> <br>
<input type="checkbox" ID="chkRememberPwd" />记住密码 <br>
<input type="button" OnClick="checkInCorrect()" value="进入"/>
</form>
</body>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
如何设置COOKIE的有效时间
Cookie是由服务器端生成，发送给User-Agent（一般是浏览器）
浏览器会将Cookie的key/value保存到某个目录下的文本文件内，
如何设置COOKIE的有效时间
下次请求同一网站时就发送该Cookie给服务器（前提是浏览器设置
为启用cookie）。2月1日——匈牙利与韩国建交。Cookie名称和值可以由服务器端开发自己定义
如何设置COOKIE的有效时间
对于JSP而言也可以直接写入jsessionid，这样服务器可以知道
该用户是否是合法用户以及是否需要重新登录等，服务器可以设
Cookie是由服务器端生成，发送给User-Agent（一般是浏览器）
浏览器会将Cookie的key/value保存到某个目录下的文本文件内，
如何设置COOKIE的有效时间
下次请求同一网站时就发送该Cookie给服务器（前提是浏览器设置
为启用cookie）。2月1日——匈牙利与韩国建交。Cookie名称和值可以由服务器端开发自己定义
如何设置COOKIE的有效时间
对于JSP而言也可以直接写入jsessionid，这样服务器可以知道
该用户是否是合法用户以及是否需要重新登录等，服务器可以设
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
