我们看到许多网站登录时都有记住用户名的复选框,例如

js实现登录时记住用户名_记住账号

js实现登录时记住用户名_记住账号_02


这样更人性化,避免用户体验差.

那么如何实现呢?

核心思路:把用户登录信息存到浏览器的cookie中,下次登录时先从浏览器cookie中读取.

在页面中如何获取cookie值呢?

如果是JSP的话,可以通过servlet的对象request 获取cookie,可以

参考:http://hw1287789687.iteye.com/blog/2050040

如果要求登录页面是html呢?html页面中如何获取cookie呢?

直接上代码了

页面:loginInput.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!-- base href="http://localhost:8080/shop_goods/" -->

<title>user login</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<script language="JavaScript" src="/shop_goods/js/common_util.js" type="text/javascript"></script>
            
<!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
<style type="text/css">
.errorMessage li {
    list-style-type: none;
    margin-left: 0
}
</style>
</head>

<body>

<script type="text/javascript">
//获取cookie的值
function getCookie(cookieKey){
    var cookies = document.cookie ? document.cookie.split('; ') : [];

    for (var i = 0, l = cookies.length; i < l; i++) {
        var parts = cookies[i].split('=');
        if(parts.length>1){
            if(parts[0]==cookieKey){
                //username1=;
                return parts[1];
            }
        }
    }
    return '';
}
var username1='';
window.onload=function(){
    //cookie的key是'userEmail'
    username1=getCookie('userEmail');

    //alert("username1:"+username1);
    var issave222=com.whuang.hsj.$$one("issave");
    if(username1){
        if(username1!='' && username1!=null &&username1!=undefined){
            com.whuang.hsj.$$one("user.username").value=username1;
            issave222.checked=true;
        }else{
            issave222.checked=false;
        }
    }else{
        issave222.checked=false;
    }
}
</script>
    This is login page.
    <br>
    <a href="/shop_goods/">index</a>
    <br>
    
        <a href="/shop_goods/user/registerUser.jsp">register user</a>
    
    <font color="red"></font>
    
    <font style="font-weight: bold" color="red"> </font>
            
    
    
        <form action="/shop_goods/user/login" method="post">
            <table>
                <tbody><tr>
                    <td>username:</td>
                    <td><input name="user.username" id="user_username" type="text">
                    </td>
                </tr>
                <tr>
                    <td>password:</td>
                    <td><input name="user.password" id="user_password" type="text">
                    </td>
                </tr>
                <tr> <td colspan="2"> <input name="issave" value="save" type="checkbox"> 保存用户名</td></tr>
                <tr>
                    <td colspan="2"><input id="" value="login" type="submit">
</td>
                    
                </tr>

            </tbody></table>
            


</form></body></html>

com.whuang.hsj.$$one等方法参见附件

参考地址:

http://hw1287789687.iteye.com/blog/2050040

http://hw1287789687.iteye.com/blog/2053897