原生js模拟存储已注册验证是否能登陆成功

tech2022-07-09  170

原生js模拟存储已注册验证是否能登陆成功

利用一个对象对数组存储用户信息,调用方式详看代码

<html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> .login_formBox{ width: 148px; margin:100px auto; } .loginLink{ width: 60px; height: 30px; background-color: #ccc; text-align: center; line-height: 30px; margin: 5px auto; } </style> </head> <body> <div class="login_formBox"> <div class="login_form"> <div class="l_f_group"> <input class="l_f_input" type="text" placeholder="手机号" id="userName"> </div> <br/> <div class="l_f_group"> <input class="l_f_input" type="password" placeholder="密码" id="password"> </div> <div class="loginLink"> <a href="#" id="loginBtn">登陆</a> </div> </div> </div> <script> // 存储已注册数据 var registDate = { registMsg:[ {'userPhone': '18444562395','password':'123456a'}, {'userPhone': '18444564562','password':'123456q'} ] } // 点击登录时判断该手机号密码是否已注册 var loginBtn = document.getElementById('loginBtn'); loginBtn.onclick = function(){ var userName = document.getElementById('userName'); var password = document.getElementById('password'); var userNameMsg = userName.value; var passwordMsg = password.value; // console.log(userNameMsg); for(var i = 0; i < registDate.registMsg.length; i++){ if(registDate.registMsg[i].userPhone == userNameMsg && registDate.registMsg[i].password == passwordMsg){ alert('登录成功'); return true; } } alert('密码不正确或该账号未注册!'); return false; } </script> </body> </html>
最新回复(0)