From 7fbab65d6172f5edeeb7c3916a017dcf4a983d07 Mon Sep 17 00:00:00 2001
From: Elvis <eluis@psunsky.com>
Date: Fri, 8 May 2020 10:46:00 +0800
Subject: [PATCH] 记住密码，清除记录。

---
 WebRoot/WEB-INF/jsp/system/index/login.jsp | 459 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
 1 file changed, 272 insertions(+), 187 deletions(-)

diff --git a/WebRoot/WEB-INF/jsp/system/index/login.jsp b/WebRoot/WEB-INF/jsp/system/index/login.jsp
index c102b86..a7f8e76 100644
--- a/WebRoot/WEB-INF/jsp/system/index/login.jsp
+++ b/WebRoot/WEB-INF/jsp/system/index/login.jsp
@@ -27,166 +27,218 @@
 <script type="text/javascript" src="static/js/jquery.tips.js"></script>
 <script type="text/javascript" src="static/js/lang.js"></script>
 <script type="text/javascript" src="static/js/remove.js"></script>
-<script type="text/javascript" >
+<script type="text/javascript">
 	if(lang() != 'zh'){
 		
 	}
 </script>
 <style type="text/css">
-html,body{
-    width:100%;
-    height:100%;
-    margin:0;
-    padding:0;
+html,body {
+	width: 100%;
+	height: 100%;
+	margin: 0;
+	padding: 0;
 }
-img{
-    width:100%;
-    display: inherit;
+
+img {
+	width: 100%;
+	display: inherit;
 }
-p{
-    margin:0;
+
+p {
+	margin: 0;
 }
-.login{
-    width:100%;
-    min-width: 1200px;
-    height:100%;
-    background: #EFEEF5;
+
+.login {
+	width: 100%;
+	min-width: 1200px;
+	height: 100%;
+	background: #EFEEF5;
 }
-.login_box{
-    width:82.3%;
-    min-width: 987.6px;
-    max-width: 1581px;
-    height:77.87%;
-    background: #fff;
-    position: absolute;
-    top:0;
-    bottom:0;
-    left:0;
-    right:0;
-    margin: auto;
-    z-index: 9;
-    box-shadow:0px 18px 33px 10px rgba(89,89,89,0.2);
+
+.login_box {
+	width: 82.3%;
+	min-width: 987.6px;
+	max-width: 1581px;
+	height: 77.87%;
+	background: #fff;
+	position: absolute;
+	top: 0;
+	bottom: 0;
+	left: 0;
+	right: 0;
+	margin: auto;
+	z-index: 9;
+	box-shadow: 0px 18px 33px 10px rgba(89, 89, 89, 0.2);
 }
-.error{
-    font-size: 12px;
-    color:#F25F62;
-    float: left;
+
+.error {
+	font-size: 12px;
+	color: #F25F62;
+	float: left;
 }
-.error img{
-    width: 12px;
-    float:left;
-    margin-top:3px;
-    margin-left:10px;
+
+.error img {
+	width: 12px;
+	float: left;
+	margin-top: 3px;
+	margin-left: 10px;
 }
-.error_info{
-    margin-left: 5px;
+
+.error_info {
+	margin-left: 5px;
 }
-input:focus-within{
-    border-style:solid;
-    border-color: #48A3A5;
+
+input:focus-within {
+	border-style: solid;
+	border-color: #48A3A5;
 	box-shadow: 0 0 5px #48A3A5;
 }
-.login_box .login_box_left_box{
-    width:40%;
-    float: left;
+
+.login_box .login_box_left_box {
+	width: 40%;
+	float: left;
+}
+
+.login_box .login_box_left_box .login_logo {
+	width: 140px;
+	margin-top: 80px;
+	margin-left: 60px;
 }
-.login_box .login_box_left_box .login_logo{
-    width:140px;
-    margin-top:80px;
-    margin-left: 60px;
+
+.login_box .login_box_left_box .login_box_contianer {
+	margin-top: 60px;
 }
-.login_box .login_box_left_box .login_box_contianer{
-    margin-top:60px;
+
+.login_box .login_box_left_box .login_box_contianer h3 {
+	text-align: center;
+}
+
+.login_box .login_box_left_box .login_box_contianer .form_item {
+	width: 70%;
+	margin: 0 auto;
+	margin-bottom: 20px;
+	text-align: center;
+	position: relative;
 }
-.login_box .login_box_left_box .login_box_contianer h3{
-    text-align: center;
+
+.login_box .login_box_left_box .login_box_contianer .form_item input {
+	width: 90%;
+	height: 50px;
+	line-height: 50px;
+	padding: 0 10px;
+	border-radius: 5px;
+	border: 1px solid #ccc;
+	outline: none;
+	background: #ECECEC
 }
-.login_box .login_box_left_box .login_box_contianer .form_item{
-    width:70%;
-    margin:0 auto;
-    margin-bottom:20px;
-    text-align: center;
+
+.login_box .login_box_left_box .login_box_contianer .form_item .icon_down
+	{
+	position: absolute;
+	right: 10px;
+	top: 9px;
+	width: 20px;
+	padding: 0 10px;
 }
-.login_box .login_box_left_box .login_box_contianer .form_item input{ 
-    width: 90%;
-    height: 50px;
-    line-height: 50px;
-    padding:0 10px;
-    border-radius: 5px;
-    border:1px solid #ccc;
-    outline: none;
-    background: #ECECEC
+
+.login_box .login_box_left_box .login_box_contianer .history {
+	width: 90%;
+	position : absolute;
+	left:10px;
+	top: 50px;
+	padding: 0 10px;
+	height: auto;
+	max-height: 240px;
+	background: #fff;
+	overflow: auto;
+	border: 1px solid #ccc;
+	z-index: 999;
+	position: absolute;
 }
-.login_btn{
-    outline-style: none;
-    border: none;
-    color: #fff;
-    width:90%;
-    height:50px;
-    line-height: 50px;
-    border-radius:8px;
-    background: #48A3A5;
+
+.login_btn {
+	outline-style: none;
+	border: none;
+	color: #fff;
+	width: 90%;
+	height: 50px;
+	line-height: 50px;
+	border-radius: 8px;
+	background: #48A3A5;
 }
-.login_box .login_box_right_box{
-    height:100%;
-    overflow: hidden;
-    margin-left: 40%;
-    position: relative;
-    background: #48A3A6;
+
+.login_box .login_box_right_box {
+	height: 100%;
+	overflow: hidden;
+	margin-left: 40%;
+	position: relative;
+	background: #48A3A6;
 }
-.login_box .login_box_right_box .dec{
-    position: absolute;
-    bottom:100px;
-    left:100px;
+
+.login_box .login_box_right_box .dec {
+	position: absolute;
+	bottom: 100px;
+	left: 100px;
 }
-.login_box .login_box_right_box .dec_big{
-    font-size: 40px;
-    color: #ECECEC;
+
+.login_box .login_box_right_box .dec_big {
+	font-size: 40px;
+	color: #ECECEC;
 }
-.login_box .login_box_right_box .dec_mini{
-    font-size: 24px;
-    color: #ECECEC;
+
+.login_box .login_box_right_box .dec_mini {
+	font-size: 24px;
+	color: #ECECEC;
 }
-.login_box .login_box_right_box .right_box_img{
-    width: 400px;
-    position: absolute;
-    right:-23px;
-    top:-25px;
+
+.login_box .login_box_right_box .right_box_img {
+	width: 400px;
+	position: absolute;
+	right: -23px;
+	top: -25px;
 }
-.right_box_bottom_img{
-    width: 200px;
-    height:200px;
-    background: #fff;
-    border-radius: 100px;
-    position: absolute;
-    bottom:-100px;
-    right:-100px;
+
+.right_box_bottom_img {
+	width: 200px;
+	height: 200px;
+	background: #fff;
+	border-radius: 100px;
+	position: absolute;
+	bottom: -100px;
+	right: -100px;
 }
-.right_box_bottom_img img{
-    width:25%;
-    margin:30px 0 0 30px;
+
+.right_box_bottom_img img {
+	width: 25%;
+	margin: 30px 0 0 30px;
 }
-.login .left_bottom_img{
-    position: absolute;
-    bottom:0;
-    left:0;
-    width:19%;
+
+.login .left_bottom_img {
+	position: absolute;
+	bottom: 0;
+	left: 0;
+	width: 19%;
 }
-.login .right_bottom_img{
-    width:6.25%;
-    position: absolute;
-    right:5%;
-    bottom:3%;
+
+.login .right_bottom_img {
+	width: 6.25%;
+	position: absolute;
+	right: 5%;
+	bottom: 3%;
 }
-.text_right{
-    text-align: right !important;
+
+.text_right {
+	text-align: right !important;
 }
-.text_right input{
-    display: inline;
-    vertical-align: middle;
+
+.text_right input {
+	display: inline;
+	vertical-align: middle;
 }
-.text_right span{
-    vertical-align: middle;
+
+.text_right span {
+	vertical-align: middle;
 }
 </style>
 
@@ -199,55 +251,74 @@ input:focus-within{
 </head>
 <body>
 	<div class="login">
-        <div class="login_box">
-            <div class="login_box_left_box">
-                <div class="login_logo">
-                    <img src="static/login/login_logo.png" alt="">
-                </div>
-                <div class="login_box_contianer">
-                    <h3>登录账号</h3>
-                   
-                        <div class="form_item">
-                            <input id="loginname" type="text" value="" placeholder="请输入用户名" />
-                        </div>
-                        <div class="form_item">
-                            <input id="password" type="password" value="" placeholder="请输入密码" />
-                        </div>
-                        <div class="form_item text_right">
-                           <!-- <div class="error">
+		<div class="login_box">
+			<div class="login_box_left_box">
+				<div class="login_logo">
+					<img src="static/login/login_logo.png" alt="">
+				</div>
+				<div class="login_box_contianer">
+					<h3>登录账号</h3>
+
+					<div class="form_item">
+						<input id="loginname" type="text" value="" autoComplete="off"
+							placeholder="请输入用户名" />
+						<svg t="1554790328236" class="icon_down" style=""
+							viewBox="0 0 1024 1024" version="1.1"
+							xmlns="http://www.w3.org/2000/svg" p-id="2161"
+							xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32">
+							<defs>
+							<style type="text/css"></style></defs>
+							<path
+								d="M863.321996 251.674996 194.108395 251.674996 528.677333 621.186771Z"
+								p-id="2162" fill="#333333"></path></svg>
+						<div class="history">
+							<ul>
+							</ul>
+							<p class="clear_history">
+								<a  onclick="clear_history()">清除记录</a>
+							</p>
+						</div>
+					</div>
+
+					<div class="form_item">
+						<input id="password" type="password" value="" placeholder="请输入密码" />
+					</div>
+					<div class="form_item text_right">
+						<!-- <div class="error">
                                 <img src="static/login/login_5.png" alt="">
                                 <span class="error_info">密码输入不正确</span>
                             </div>  -->
-                            <input id="rem_flag" style="width:17px;height:17px;" type="checkbox"> 
-                            <span >记住密码</span> 
-                        </div>
-                        <div class="form_item">
-                            <button href="#" type="submit" onclick="severCheck();" class="login_btn">登录</button>
-                        </div>
-                   
-                </div>
-            </div>
-            <div class="login_box_right_box">
-                <div class="dec">
-                    <p class="dec_big">南昊考试作业管理平台</p>
-                    <p class="dec_mini">让天下师生减负提分！</p>
-                </div>
-                <div class="right_box_img">
-                    <img src="static/login/login_11.png" alt="">
-                </div>
-                <div class="right_box_bottom_img">
-                    <img src="static/login/login_7.png" alt="">
-                </div>
-            </div>
-        </div>
-        <div class="left_bottom_img">
-            <img src="static/login/login_10.png" alt="">
-        </div>
-        <div class="right_bottom_img">
-            <img src="static/login/cycle.png" alt="">
-        </div>
-    </div>
-		<script type="text/javascript">
+						<input id="rem_flag" style="width:17px;height:17px;"
+							type="checkbox"> <span>记住密码</span>
+					</div>
+					<div class="form_item">
+						<button href="#" type="submit" onclick="severCheck();"
+							class="login_btn">登录</button>
+					</div>
+
+				</div>
+			</div>
+			<div class="login_box_right_box">
+				<div class="dec">
+					<p class="dec_big">南昊考试作业管理平台</p>
+					<p class="dec_mini">让天下师生减负提分！</p>
+				</div>
+				<div class="right_box_img">
+					<img src="static/login/login_11.png" alt="">
+				</div>
+				<div class="right_box_bottom_img">
+					<img src="static/login/login_7.png" alt="">
+				</div>
+			</div>
+		</div>
+		<div class="left_bottom_img">
+			<img src="static/login/login_10.png" alt="">
+		</div>
+		<div class="right_bottom_img">
+			<img src="static/login/cycle.png" alt="">
+		</div>
+	</div>
+	<script type="text/javascript">
    
    		if(window.top != window.self){
 	   		window.top.location.href = "<%=basePath%>";
@@ -262,6 +333,11 @@ input:focus-within{
    		    }
    		}
    		
+   		$(".icon_down").click(function(){
+   			$("#loginname").focus();
+   			
+   		});
+   		
    		//客户端校验
 		function check() {
 
@@ -369,20 +445,27 @@ input:focus-within{
 	   	   			$(".history").show();
 	   			}
    		});
+   		
+   		$('.history').hover(function(){         //鼠标悬停下拉框时，解绑blur事件
+   	   		$("#loginname").unbind("blur");
+   		},function(){
+   			$("#loginname").blur(function(){    //鼠标移出下拉框时，添加blur事件
+	   	   		$(".history").hide();
+	   	   	})
+   		});
+   		
+   		$(document).on('click','.history li',function(){
+   			var p_list=JSON.parse(storage.getItem('passWordList'));
+   			$("#loginname").val($(this).text());
+   			$("#password").val(p_list[$(this).index()]);
+   			$(".history").hide();
+   		})
 		
 		//清除历史记录
    		function clear_history(){
-   			window.top.remove.init({"title":"确定清除历史记录吗？","func":function(success){
-   				if(success){
-   					storage.clear();
-   					$(".history").hide();
-   				}else{
-   					console.log("false");
-   				}
-   			}});
-   			window.top.remove.show();
-   			$(".mb_head .close img").css("display","none");
-   		}
+			storage.clear();
+			$(".history").hide();
+   		}	
 		//保存登录记录
 		function saveCookie() {
 			if(!window.localStorage){
@@ -419,8 +502,10 @@ input:focus-within{
 			
 		}
 	</script>
-		<!-- 软键盘控件start -->
-		<script type="text/javascript" src="static/login/keypad/js/form/keypad.js"></script>
-		<script type="text/javascript" src="static/login/keypad/js/framework.js"></script>
+	<!-- 软键盘控件start -->
+	<script type="text/javascript"
+		src="static/login/keypad/js/form/keypad.js"></script>
+	<script type="text/javascript"
+		src="static/login/keypad/js/framework.js"></script>
 </body>
 </html>
\ No newline at end of file
--
libgit2 0.21.4