js记住用户名密码(摘抄)

CONTENT
    login.html
    welcome.html
    cookie.js
    common.js

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>


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>
<href="login.html">点击返回登陆框</a>
</body>
</html>


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 (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;
}


common.js

function $(objStr){return document.getElementByIdx_x_x(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("用户名或密码错误,请重新输入!");    
     }
}
原文地址:https://www.cnblogs.com/chenjiang/p/2405726.html