<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>注册页面</title> <link rel="shortcut icon" href="imgs/WB_logo.png"> <style> .login { width: 1500px; height: 900px; background: #f2f2f5; padding: 20px; background: url("imgs/1.jpg") no-repeat center top; } .login_form { width: 270px; height: 190px; padding: 0; margin: 0 auto; line-height: 30px; } .z_input, .m_input, .q_input{ height: 28px; width: 250px; } .dl { width: 100px; height: 30px; float: left; position: relative; top: 5px; left: 20px; } .zc { width: 100px; height: 30px; float: left; position: relative; top: 5px; left: 40px; }
</style></head><body><div class="login"> <div class="login_form"> 姓名： <input class="z_input" type="text" id="username"><br> 密码： <input class="m_input" type="password" id="password"><br> 确认密码：<input class="q_input" type="password" id="password_last"><br> <input class="dl" type="button" value="登录" onclick="window.location='login.html'"> <input class="zc" type="button" value="注册" onclick="f1()"> </div></div></body></html> <script> function f1() { //获取输入的姓名 var userName=document.getElementById("username").value; // console.log(userName); //获取输入的密码 var password=document.getElementById("password").value; // console.log(password); //确认密码 var password_last=document.getElementById("password_last").value; // console.log(password_last); //存储数组 var array=[userName,password,password_last]; var flag = true; if (array[0] == ""){ alert("用户名不能为空，请重新输入！"); } var users = localStorage.getItem("user"); var user_arr = JSON.parse(users); if (user_arr != null && user_arr[0] == array[0]){ flag = false; alert("该用户名已经被占用，请重新输入"); } // } if (array[1] == "" || array[2] == "") { alert("密码不能为空"); flag = false; } if (array[1] != array[2]){ flag = false; alert("两次输入的密码不一致") } if (flag){ var cc=JSON.stringify(array); localStorage.setItem("user",cc); } } </script>