cookie——cookie记录用户名

 

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script>
window.onload = function() {
    
    var oUsername = document.getElementById('username');
    var oLogin = document.getElementById('login');
    var oDel = document.getElementById('del');
    
    if ( getCookie('username') ) {  //如果登陆过username有数值
        oUsername.value = getCookie('username');  //输入框显示曾经输入过的username的值
    }
    
    oLogin.onclick = function() {  //如果点击登录
        
        alert('登陆成功');
        setCookie('username', oUsername.value, 5);  //设置username的值，过期时间为5天
        
    }
    
    oDel.onclick = function() {  //点击删除
        removeCookie('username');  //移除username的cookie
        oUsername.value = '';  //同时输入框的数值为空
    }
    
}

function setCookie(key, value, t) {
    var oDate = new Date();
    oDate.setDate( oDate.getDate() + t );
    document.cookie = key + '=' + value + ';expires=' + oDate.toGMTString();
}

function getCookie(key) {
    var arr1 = document.cookie.split('; ');
    for (var i=0; i<arr1.length; i++) {
        var arr2 = arr1[i].split('=');
        if ( arr2[0] == key ) {
            return decodeURI(arr2[1]);
        }
    }
}

function removeCookie(key) {
    setCookie(key, '', -1);
}
</script>
</head>

<body>
    <input type="text" id="username" />
    <input type="button" value="登陆" id="login" />
    <input type="button" value="删除" id="del" />
</body>
</html>

 

posted @ 2017-04-13 19:56  念念念不忘  阅读(150)  评论(0)    收藏  举报