zoukankan      html  css  js  c++  java
  • sessionStorage

     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>
    login.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>
    main.html
  • 相关阅读:
    Java基本开发环境搭建(适合第一次使用)
    在oracle中通过链接服务器(dblink)访问sql server
    C# 鼠标悬停在datagridview的某单元格,显示悬浮框效果
    经典SQL语句大全
    程序员为何要写技术博客?
    收缩SQL数据库日志
    利用脚本设置本机IP地址
    在SQL Server 2005中连接Oracle,完成查询、插入操作
    Centos 7 下 Corosync + Pacemaker + psc + HA-proxy 实现业务高可用
    Centos 7 下 Corosync + Pacemaker + psc 实现 httpd 服务高可用
  • 原文地址:https://www.cnblogs.com/xuqidong/p/13137714.html
Copyright © 2011-2022 走看看