1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>登录</title> 6 <style> 7 .login { 8 width: 300px; 9 height: 300px; 10 border: 1px solid green; 11 margin: 0 auto; 12 text-align: center; 13 padding-top: 10px; 14 } 15 </style> 16 </head> 17 <body> 18 <form action="" class="login"> 19 <label for="name">账号:</label><input type="text" value="" id="name"><br> 20 <label for="pwd">密码:</label><input type="password" value="" id="pwd"><br> 21 <input class="btn" type="button" value="登录" onclick="login()"> 22 </form> 23 </body> 24 <script> 25 window.document.onkeyup = function (ev) { 26 if (ev.keyCode == 13) { 27 login() 28 } 29 } 30 function Emp(account, password, nickname) { 31 this.account = account; 32 this.password = password; 33 this.nickname = nickname 34 } 35 function login() { 36 var name = document.getElementById(‘name‘); 37 var pwd = document.getElementById(‘pwd‘); 38 if (name.value.length == 0) { 39 alert(‘账号不能为空‘); 40 name.focus() 41 } else if (pwd.value.length == 0) { 42 alert(‘密码不能为空‘); 43 document.querySelector(‘#pwd‘).focus() 44 } else { 45 var emp = new Emp(name, pwd, ‘文康‘); 46 sessionStorage.setItem(‘op‘, JSON.stringify(emp)); 47 window.location.replace(‘main.html‘) 48 } 49 } 50 51 </script> 52 </html>
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>SQL审核系统</title> 6 </head> 7 <body> 8 开发者:<span id="operator"></span> 9 <br> 10 <button onclick="logout()">退出系统</button> 11 </body> 12 <script> 13 window.onload = function () { 14 let operatorString = sessionStorage.getItem(‘op‘); 15 if (operatorString != null) { 16 document.querySelector(‘#operator‘).innerText = JSON.parse(operatorString).nickname; 17 } else { 18 logout() 19 } 20 }; 21 function logout() { 22 sessionStorage.clear(); 23 window.location.replace(‘login.html‘) 24 } 25 </script> 26 </html>
原文:https://www.cnblogs.com/xuqidong/p/13137714.html