参照 - 纯JS操作Cookie
点击submit按钮时,会调用此函数
文档加载完毕后,执行此函数
**说明 : **初始时,浏览器未保存Cookie,JS给各个表单赋空值,赋复选框未勾选状态
**说明 : **未勾选保存密码复选框,JS只提交表单到指定Action,未保存Cookie,同上
**说明 : **浏览器成功保存了用户名与密码
如图所示操作代码即可：
登录页面实现记住用户名和密码功能的方法：
1、使用cookie的方法将用户名和密码保存到本地电脑上；
2、PS在页面载入时获取cookie；
3、在勾选时设置一个cookie的有效时间就可以了。
/*** 操作Cookie 添加
* @param name
* @param value
* @return
*/
function SetCookie(name,value,days)//两个参数，一个是cookie的名子，一个是值
{
var Days = 30
if(typeof(days)=="undefined"||isNaN(days))
Days=parseInt(days.toString())
//此 cookie 将被保存 30 天 -1为浏览器关闭
if(Days!=-1){
var exp = new Date() //new Date("December 31, 9998")
exp.setTime(exp.getTime() + Days*24*60*60*1000)
document.cookie = name + "="+ escape (value) + "expires=" + exp.toGMTString()
}else{
document.cookie = name + "="+ escape (value) + "expires=-1"
}
}
/**
* 操作Cookie 提取 后台必须是escape编码
* @param name
* @return
*/
function getCookie(name)//取cookies函数
{
var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^]*)(|$)"))
if(arr != null) return unescape(arr[2])return null
}
/**
* 操作Cookie 删除
* @param name
* @return
*/
function delCookie(name)//删除cookie
{
var exp = new Date()
exp.setTime(exp.getTime() - (86400 * 1000 * 1))
var cval=getCookie(name)
if(cval!=null)
document.cookie = name + "="+ escape (cval) + "expires="+exp.toGMTString()
}
/**
* 根据ID获取对象
* @param objName
* @return
*/
function GetObj(objName){
if(typeof(objName)=="undefined")
return null
if(document.getElementById)
return eval('document.getElementById("'+objName+'")')
else
return eval('document.all.'+objName)
}
/**
* 给String 添加trim方法
*/
String.prototype.trim=function(){
return this.replace(/(^\s*)|(\s*$)/g, "")
}
/**
* 给String添加isNullOrempty的方法
*/
String.prototype.isnullorempty=function(){
if(this==null||typeof(this)=="undefined"||this.trim()=="")
return true
return false
}
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>login.html</title>
<script type="text/javascript" src="jsTool.js"></script>
<script type="text/javascript">
var cookieName_username="LOGIN_USER_NAME_TEST"
var cookieName_password="LOGIN_PASSWORD_TEST"
var cookieName_autologin="LOGIN_AUTO_TEST"
//得到Cookie信息
function getUserInfoByCookie(){
var uname=getCookie(cookieName_username)
if(uname!=null&&!uname.toString().isnullorempty()){
GetObj('ttuserName').value=uname
GetObj('ck_saveuser').checked=true
}
var upass=getCookie(cookieName_password)
if(upass!=null&&!upass.toString().isnullorempty()){
GetObj('ttpassword').value=upass
GetObj('ck_savepass').checked=true
}
var autologin=getCookie(cookieName_autologin)
if(autologin!=null&&!autologin.toString().isnullorempty())
if(autologin.toString().trim()=="true"){
GetObj('ck_autologin').checked=true
login()//登录
}
}
/**
*登录（保存信息）
*/
function login(){
var tusername=GetObj('ttuserName')
if(tusername.value.trim().isnullorempty()){
alert('您尚未输入用户名!请输入!')
tpassword.focus()
return
}
var tpassword=GetObj('ttpassword')
if(tpassword.value.trim().isnullorempty()){
alert('您尚未输入密码!请输入!')
tpassword.focus()
return
}
delCookie(cookieName_username)//删除用户名Cookie
var tsaveuser=GetObj('ck_saveuser')
if(tsaveuser.checked)
SetCookie(cookieName_username,tusername.value.trim(),7)//保存到Cookie中 保存7天
delCookie(cookieName_password)//删除密码
var tsavepass=GetObj('ck_savepass')
if(tsavepass.checked)
SetCookie(cookieName_password,tpassword.value.trim(),7)
var autologin=GetObj('ck_autologin')
SetCookie(cookieName_autologin,autologin.checked,7)
alert('登录成功!')
}
</script>
</head>
<body onload="getUserInfoByCookie()">
用户名：<input type="text" value="" name="ttuserName" id="ttuserName" maxlength="16"/>
密码：<input type="password" value="" name="ttpassword" id="ttpassword" maxlength="16"/>
<input type="checkbox" name="ck_saveuser" id="ck_saveuser"/>保存用户名
<input type="checkbox" name="ck_savepass" id="ck_savepass"/>保存密码
<input type="checkbox" name="ck_autologin" id="ck_autologin"/>自动登录
<input type="button" value="登录（保存）" onclick="login()"/>
</body>
</html>
能不能审批呀
