HTML5本地存储来注册登录

最新推荐文章于 2024-06-18 15:21:18 发布

sweetllh

最新推荐文章于 2024-06-18 15:21:18 发布

阅读量5.3k

点赞数 10

分类专栏： html5 文章标签： html5

本文链接：https://blog.csdn.net/sweetllh/article/details/76339066

版权

html5 专栏收录该内容

16 篇文章 3 订阅

订阅专栏

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <link rel="stylesheet" type="text/css" href="css/reset.css"/>
        <style type="text/css">
            textarea{
                resize: none;
            }
        </style>
        <script type="text/javascript">
            window.onload=function(){
                var oUser=document.getElementById('username');
                var oPwd=document.getElementById('password');
                var oBtn=document.getElementById('btn');
                oBtn.onclick=function(){
                    var upData=null;
                    var repeat=null;
                    if (oUser.value&&oPwd.value) {
                        if (window.localStorage.getItem('list')) {
                            upData={'username':oUser.value,'password':oPwd.value};
                            var dataJson=window.localStorage.getItem('list');
                            dataJson=eval('('+dataJson+')');
                            for (var i=0;i<dataJson.length;i++) {
                                if (dataJson[i].username==upData.username) {
                                    alert('用户名重复');
                                    repeat=1;
                                }
                            }
                            if (repeat==null) {
                                alert('注册成功');
                                dataJson.push(upData);
                                dataJson=JSON.stringify(dataJson);
                                window.localStorage.setItem('list',dataJson);
                                console.log(window.localStorage.getItem('list'));
                            }
                        } else {
                            upData={'username':oUser.value,'password':oPwd.value};
                            console.log(upData);
                            var data=[];
                            data.push(upData);
                            data=JSON.stringify(data);
                            window.localStorage.setItem('list',data);
                            alert('注册成功');
                            console.log(window.localStorage.getItem('list'));
                        }
                    }
                }
            }
        </script>
    </head>
    <body>
        <form action="" method="post">
            用户名：<input type="text" id="username" /><br />
            密码：<input type="password" id="password" /><br />
            <input type="button" id="btn" value="注册" />
        </form>
    </body>
</html>

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <link rel="stylesheet" type="text/css" href="css/reset.css"/>
        <style type="text/css">
            textarea{
                resize: none;
            }
        </style>
        <script type="text/javascript">
            window.onload=function(){
                var oUser=document.getElementById('username');
                var oPwd=document.getElementById('password');
                var oBtn=document.getElementById('btn');
                oBtn.onclick=function(){
                    var login={'username':oUser.value,'password':oPwd.value};
                    var dataJson=window.localStorage.getItem('list');
                    var success=null;
                    dataJson=eval('(' + dataJson + ')');
                    for (var i=0;i<dataJson.length;i++) {
                        if (dataJson[i].username==login.username&&dataJson[i].password==login.password) {
                            alert('登陆成功');
                            success=1;
                        }
                    }
                    if (success==null) {
                        alert('用户名或密码错误');
                    }
                }
            }
        </script>
    </head>
    <body>
        <form action="" method="post">
            用户名：<input type="text" id="username" /><br />
            密码：<input type="password" id="password" /><br />
            <input type="button" id="btn" value="登陆" />
        </form>
    </body>
</html>

sweetllh

关注

10
点赞
踩
39

收藏

觉得还不错? 一键收藏
4
评论
HTML5本地存储来注册登录

注册<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" type="text/css" href="css/reset.css"/> <style type="text/css">
复制链接

扫一扫

专栏目录