web浏览器利用本地储存实现记住用户名_web禁止浏览器记住密码,怎样实现在本地记住密码-优快云博客

本文链接：https://blog.youkuaiyun.com/baidu_41660182/article/details/87606840

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script>
            window.onload=function(){
                /*页面打开，判断是否存储过用户名---*/
                var uName=window.localStorage.getItem('userName');
                var password=window.localStorage.getItem('password');
                console.log(uName)
                if(password != null){//说明之前存储过值，说明用户希望记住用户名
                    document.getElementById('password').value=password;       
                }
                if(uName != null){//说明之前存储过值，说明用户希望记住用户名
                    document.getElementById('userName').value=uName;       
                }
                /*点击登录时存储数据*/
                document.getElementById("submit").onclick=function(){
                    var name=document.getElementById('userName').value;
                    var pass=document.getElementById('password').value;
                    /*判断用户是否选择记住用户名*/
                    var isRemenber=document.getElementById('isRemenber');
                    if(isRemenber.checked==true){
                        /*存储数据到localstorage*/
                        window.localStorage.setItem('userName',name);
                        window.localStorage.setItem('password',pass);
                    }
                    else{
                        window.localStorage.removeItem('userName');
                        window.localStorage.removeItem('password');
                    }
                }
            }
        </script>
    </head>
    <body>
        <form action="#">
            <input type="userName" id="userName"/>
            <input type="password" id="password"/>
            <input type="checkbox" id="isRemenber" />
            <input type="submit" value="submit" id="submit"/>
        </form>
    </body>
</html>