92 lines
3.4 KiB
HTML
92 lines
3.4 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>重置</title>
|
|
<link rel="stylesheet" href="static/css/layui.css" media="all">
|
|
<style>
|
|
.layui-form {width: 450px; margin: 21px auto 0;}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div class="layui-container">
|
|
<div class="layui-row">
|
|
<div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
|
|
<form class="layui-form" style="margin-top: 20px;">
|
|
|
|
<div class="layui-form-item">
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">验证手机号</label>
|
|
<div class="layui-input-inline layui-input-wrap">
|
|
<input type="tel" name="phone" lay-verify="required|phone" autocomplete="off"
|
|
lay-reqtext="请填写手机号" lay-affix="clear" class="layui-input demo-phone">
|
|
</div>
|
|
<div class="layui-form-mid" style="padding: 0!important;">
|
|
<button type="button" class="layui-btn layui-btn-primary" lay-on="get-vercode">获取验证码
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">验证码</label>
|
|
<div class="layui-input-inline layui-input-wrap">
|
|
<input type="text" name="vercode" lay-verify="required" autocomplete="off" lay-affix="clear"
|
|
class="layui-input">
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">新密码</label>
|
|
<div class="layui-input-block">
|
|
<input type="password" name="newPassword" required lay-verify="required"
|
|
placeholder="请输入新密码"
|
|
autocomplete="off" class="layui-input" id="newPassword">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">确认密码</label>
|
|
<div class="layui-input-block">
|
|
<input type="password" name="confirmPassword" required lay-verify="required"
|
|
placeholder="请确认新密码"
|
|
autocomplete="off" class="layui-input">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<div class="layui-input-block">
|
|
<button class="layui-btn" lay-submit lay-filter="formDemo">重置密码</button>
|
|
</div>
|
|
</div>
|
|
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="static/layui.js"></script>
|
|
<script>
|
|
layui.use(['form'], function () {
|
|
var form = layui.form;
|
|
|
|
// 这里可以写一些表单验证逻辑
|
|
form.verify({
|
|
// 例如确认密码的逻辑
|
|
});
|
|
|
|
// 监听提交
|
|
form.on('submit(formDemo)', function (data) {
|
|
// 发送Ajax请求到后端API处理重置密码
|
|
// ...
|
|
|
|
return false; // 阻止表单跳转
|
|
});
|
|
});
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|