|
|
@@ -54,6 +54,7 @@ |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
background: transparent; |
|
|
|
position: relative; |
|
|
|
} |
|
|
|
form input{ |
|
|
|
height: 40px; |
|
|
@@ -101,6 +102,19 @@ |
|
|
|
.form__tips.is--error{ |
|
|
|
color: red |
|
|
|
} |
|
|
|
|
|
|
|
/* 密码框显示隐藏图表 */ |
|
|
|
|
|
|
|
#close_eyes, #open_eyes{ |
|
|
|
width: 18px; |
|
|
|
height: 18px; |
|
|
|
position: absolute; |
|
|
|
right: 50px; |
|
|
|
top: 72px; |
|
|
|
} |
|
|
|
#open_eyes { |
|
|
|
display: none; |
|
|
|
} |
|
|
|
</style> |
|
|
|
</head> |
|
|
|
<body> |
|
|
@@ -110,7 +124,10 @@ |
|
|
|
<p>TUOHENG LOGIN PLATFORM</p> |
|
|
|
<form th:action="@{/login}" method="post"> |
|
|
|
<input name="username" placeholder="请输入用户名" type="text"/> |
|
|
|
<input name="password" placeholder="请输入密码" type="password"/> |
|
|
|
<input id="password" name="password" placeholder="请输入密码" type="password"/> |
|
|
|
<!-- 密码显示隐藏 --> |
|
|
|
<img src="../static/close.png" alt="" id="close_eyes"> |
|
|
|
<img src="../static/open.png" alt="" id="open_eyes"> |
|
|
|
<div class="form__code"> |
|
|
|
<input name="validateCode" placeholder="请输入验证码" /> |
|
|
|
<input id="codekey" name="codekey" type="hidden"/> |
|
|
@@ -150,6 +167,21 @@ |
|
|
|
}) |
|
|
|
} |
|
|
|
|
|
|
|
// 密码显示隐藏 |
|
|
|
const passwordDom = document.getElementById('password') |
|
|
|
const openIcon = document.getElementById('open_eyes') |
|
|
|
const closeIcon = document.getElementById('close_eyes') |
|
|
|
closeIcon.onclick = function() { |
|
|
|
passwordDom.type = 'text' |
|
|
|
openIcon.style.display = 'block' |
|
|
|
closeIcon.style.display = 'none' |
|
|
|
} |
|
|
|
openIcon.onclick = function() { |
|
|
|
passwordDom.type = 'password' |
|
|
|
openIcon.style.display = 'none' |
|
|
|
closeIcon.style.display = 'block' |
|
|
|
} |
|
|
|
|
|
|
|
$(document).ready(function() { |
|
|
|
$.ajax({ |
|
|
|
url : "/vercode",//后台请求的数据 |