127 lines
4.9 KiB
HTML
127 lines
4.9 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||
<meta name="viewport"
|
||
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
|
||
<title>找回密码</title>
|
||
<link rel="stylesheet" href="./css/swiper.min.css" />
|
||
<link rel="stylesheet" href="./css/aos.css" />
|
||
<link rel="stylesheet" href="./css/index.css" />
|
||
<link rel="stylesheet" href="./css/media.css" />
|
||
</head>
|
||
|
||
<body>
|
||
<!-- 桌面端顶部 -->
|
||
<div class="header">
|
||
<div class="header-container">
|
||
<a href="index.html" class="header-logo" style="padding: 19px 0;">
|
||
<img src="./images/logo.svg" alt="" height="32" />
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<!-- 移动端顶部 -->
|
||
<div class="mHeader">
|
||
<a href="index.html" class="header-logo">
|
||
<img src="./images/logo.svg" alt="" height="20" />
|
||
</a>
|
||
</div>
|
||
|
||
<div class="logindl">
|
||
<div class="login-box">
|
||
<img src="./images/login-img1.png" alt="">
|
||
<div class="login-form">
|
||
<div class="login-head">
|
||
<span>找回密码</span>
|
||
<a href="login.html">返回登录</a>
|
||
</div>
|
||
<div class="login-code">
|
||
<input type="tel" name="userPhone" id="userPhone" placeholder="请输入您的手机号" />
|
||
<span class="area-code" onclick="getArea()">86</span>
|
||
<div class="area-list">
|
||
<p onclick="setArea(this, '80')">80</p>
|
||
<p onclick="setArea(this, '81')">81</p>
|
||
<p onclick="setArea(this, '82')">82</p>
|
||
<p onclick="setArea(this, '83')">83</p>
|
||
<p onclick="setArea(this, '84')">84</p>
|
||
<p onclick="setArea(this, '85')">85</p>
|
||
<p onclick="setArea(this, '86')" class="area-on">86</p>
|
||
<p onclick="setArea(this, '87')">87</p>
|
||
</div>
|
||
</div>
|
||
<div class="login-code">
|
||
<input type="text" name="code" id="code" placeholder="请输入验证码" />
|
||
<p onclick="getCode()" id="getCode">获取验证码</p>
|
||
</div>
|
||
<input type="password" name="passWord" id="passWord" placeholder="设置密码" />
|
||
<input type="button" value="确定" />
|
||
<div class="login-head register-read">
|
||
<p onclick="savePass()">
|
||
<i></i> 我已阅读并同意
|
||
</p>
|
||
<a href="">《平台服务协议》</a>
|
||
<a href="">《平台隐私政策》</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<p class="copy-right">
|
||
Copyright @ 2023 上海河滔信息科技有限公司 地址：上海市松江区九泾路655号嘉南红塔8号楼805室 <br>
|
||
版权所有沪ICP备2023008024号-1
|
||
</p>
|
||
</div>
|
||
|
||
<script src="./js/jquery-3.7.1.min.js"></script>
|
||
<script src="./layer/layer.js"></script>
|
||
<script src="./js/aos.js"></script>
|
||
<script src="./js/swiper-bundle.min.js"></script>
|
||
<script src="./layer/layer.js"></script>
|
||
<script src="./js/index.js"></script>
|
||
<script>
|
||
var is_read = false;
|
||
var _time = 59
|
||
var _timer = null
|
||
function savePass() {
|
||
if (!is_read) {
|
||
$('.register-read i').css('background-image', 'url("./images/checked.svg")')
|
||
} else {
|
||
$('.register-read i').css('background-image', 'none')
|
||
}
|
||
is_read = !is_read
|
||
}
|
||
function getCode() {
|
||
var _phone = $('#userPhone').val()
|
||
if (_phone === '') {
|
||
layer.msg('请输入手机号')
|
||
return
|
||
}
|
||
if (!/^1(3|4|5|6|7|8|9)\d{9}$/.test(_phone)) {
|
||
layer.msg('请输入正确的手机号')
|
||
return
|
||
}
|
||
if (_timer !== null) return
|
||
$('#getCode').text(_time + ' S')
|
||
_timer = setInterval(() => {
|
||
_time--
|
||
$('#getCode').text(_time + ' S')
|
||
if (_time === 0) {
|
||
$('#getCode').text('获取验证码')
|
||
clearInterval(_timer)
|
||
_time = 59
|
||
_timer = null
|
||
}
|
||
}, 1000);
|
||
}
|
||
function getArea() {
|
||
$('.area-list').toggle()
|
||
}
|
||
function setArea(elem, code) {
|
||
$('.area-code').text(code)
|
||
$('.area-list').hide()
|
||
$(elem).addClass('area-on').siblings('p').removeClass('area-on')
|
||
}
|
||
</script>
|
||
</body>
|
||
|
||
</html> |