登陆页面中的记住密码功能
1.login.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>login</title>
<script type="text/javascript" src="cookie.js"></script>
<script type="text/javascript" src="common.js"></script>
</head>
<body>
<form action="">
<p>
<span>UserName:</span>
<input id="userName" type="text" value=""/></p>
<p>
<span>Password:</span>
<input id="password" type="password" value=""/></p>
<p>
<span style="font-size:12px; color:blue;">记住密码</span>
<input id="saveCookie" type="checkbox" value="" /></p>
<p>
<input id="submit" type="button" value="GO" />
</p>
</form>
</body>
</html>
2.welcome.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>welcome</title>
</head>
<body>
<h1>Welcome!</h1>
<a href="login.html">点击返回登陆框</a>
</body>
3.cookie.js
//新建cookie。
//hours为空字符串时,cookie的生存期至浏览器会话结束。hours为数字0时,建立的是一个失效的cookie,这个cookie会覆盖已经建立过的同名、同path的cookie（如果这个cookie存在）。
function setCookie(name,value,hours,path){
var name = escape(name);
var value = escape(value);
var expires = new Date();
expires.setTime(expires.getTime() + hours*3600000);
path = path == "" ? "" : ";path=" + path;
_expires = (typeof hours) == "string" ? "" : ";expires=" + expires.toUTCString();
document.cookie = name + "=" + value + _expires + path;
}
//获取cookie值
function getCookieValue(name){
var name = escape(name);
//读cookie属性，这将返回文档的所有cookie
var allcookies = document.cookie;
//查找名为name的cookie的开始位置
name += "=";
var pos = allcookies.indexOf(name);
//如果找到了具有该名字的cookie，那么提取并使用它的值
if (pos != -1){ //如果pos值为-1则说明搜索"version="失败
var start = pos + name.length; //cookie值开始的位置
var end = allcookies.indexOf(";",start); //从cookie值开始的位置起搜索第一个";"的位置,即cookie值结尾的位置
if (end == -1) end = allcookies.length; //如果end值为-1说明cookie列表里只有一个cookie
var value = allcookies.substring(start,end); //提取cookie的值
return unescape(value); //对它解码
}
else return ""; //搜索失败，返回空字符串
}
//删除cookie
function deleteCookie(name,path){
var name = escape(name);
var expires = new Date(0);
path = path == "" ? "" : ";path=" + path;
document.cookie = name + "="+ ";expires=" + expires.toUTCString() + path;
}
</html>
4.common.js
function $(objStr){return document.getElementById(objStr);}
window.onload = function(){
//分析cookie值，显示上次的登陆信息
var userNameValue = getCookieValue("userName");
$("userName").value = userNameValue;
var passwordValue = getCookieValue("password");
$("password").value = passwordValue;
//写入点击事件
$("submit").onclick = function()
{
var userNameValue = $("userName").value;
var passwordValue = $("password").value;
//服务器验证（模拟）
var isAdmin = userNameValue == "admin" && passwordValue =="123456";
var isUserA = userNameValue == "userA" && passwordValue =="userA";
var isMatched = isAdmin || isUserA;
if(isMatched){
if( $("saveCookie").checked){
setCookie("userName",$("userName").value,24,"/");
setCookie("password",$("password").value,24,"/");
}
alert("登陆成功,欢迎你," + userNameValue + "!");
self.location.replace("welcome.html");
}
else alert("用户名或密码错误，请重新输入！");
}
}
分享到：
相关推荐
cookie是一种WEB服务器通过浏览器在访问者的硬盘上存储信息的手段。Cookie的目的就是为用户带来方便，为网站带来增值。这篇文章主要介绍了JavaWeb 中Cookie实现记住密码的功能示例,需要的朋友可以参考下
jquery中实现cookie的操作相比js要简单很多 操作步骤如下 1、引入JS文件（下载包中已包含） jquery-1.7.1.js jquery.cookie.js 语法： $.cookie(“cookie变量名”, “cookie值”, {expires:过期天数});
cookie实现记住用户名密码（IntelliJ IDEA+tomcat）完整项目代码
NULL 博文链接：https://492664447-qq-com.iteye.com/blog/1565952
利用js+Cookie实现的记住用户名、密码功能，简单、实用、无后台繁琐代码，新手亦可看懂。
本文介绍了vue项目实现记住密码到cookie功能示例，分享给大家，具体如下： 登陆页面 实现功能： 1.记住密码勾选，点登陆时，将账号和密码保存到cookie，下次登陆自动显示到表单内 2.不勾选，点登陆时候则清空之前...
使用jsp+Servlet+cookie实现一个登录功能，登录时可以选中记住密码。
vue登录页-记住密码功能 1.下载jsencrypt 加密解密插件 npm install jsencrypt --dev 2.引用src-utils -jsencrypt.js文件， 3.登录页先引用-代码如下 import Cookies from 'js-cookie'//cook引用 2021-08-09 ...
记住密码js 存储cookie记住密码记住密码js
java cookie 读写，记住密码 自动登录
主要介绍了Java 模拟cookie登陆简单操作,结合实例形式分析了Java 模拟cookie登陆的相关原理与基本实现技巧,需要的朋友可以参考下
利用js开发的记住密码功能，将用户输入存在浏览器的cookie中，经测试，在ie，ff和chrome均可用
1 使用pageContext设置属性，该属性默认在page范围内 2 使用request获取客户端ur1、客户提交信息的方式等信息，在登录后显示 3 通过Session实现页面传值 4 通过Cookie实现登录时，记住用户密码的功能。
全部js，实现记住密码的功能。里面主要用的是cookie。
用户登录功能、同时记住用户名密码，通过复选框勾选和不勾选实现记住、清除cookie中用户名密码等。
js操作cookie，记住用户名，密码。
在做一个前台的登陆和后台的信息审核管理功能时，需要用到记住密码的模块：虽然.net内置了登陆控件，有记住密码的功能，但还是想自己实践一下，以下代码主要应用了COOKIE，包括安全加密的过程等。 代码如下://设置...
纯servlet编写登陆功能，实现自动登陆、记住密码。展示了cookie和session的用法。注释详细，可以作为今后的参考
Cookie实现记住密码及解决中文乱码