创建 register.html

master
wangsiyuan 2023-12-23 16:05:46 +08:00
parent 5c909f8626
commit 9de6a25fd8
1 changed files with 91 additions and 0 deletions

View File

@ -0,0 +1,91 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>注册</title>
<link href="static/css/layui.css" rel="stylesheet">
</head>
<body>
<style>
.demo-reg-container {
width: 320px;
margin: 21px auto 0;
}
.demo-reg-item {
margin-bottom: 10px; /* 调整间距 */
}
</style>
<h1 style="text-align:center; color: #16baaa;">注册</h1>
<form class="layui-form">
<div class="demo-reg-container">
<div class="layui-form-item demo-reg-item">
<div class="layui-input-wrap">
<div class="layui-input-prefix">
<i class="layui-icon layui-icon-username"></i>
</div>
<input type="text" name="nickname" value="" lay-verify="required" placeholder="昵称"
autocomplete="off" class="layui-input" lay-affix="clear">
</div>
</div>
<div class="layui-form-item demo-reg-item">
<div class="layui-input-wrap">
<div class="layui-input-prefix">
<i class="layui-icon layui-icon-cellphone"></i>
</div>
<input type="text" name="cellphone" value="" lay-verify="required|phone" placeholder="手机号"
lay-reqtext="请填写手机号" autocomplete="off" class="layui-input" id="reg-cellphone">
</div>
</div>
<div class="layui-form-item demo-reg-item">
<div class="layui-input-wrap">
<div class="layui-input-prefix">
<i class="layui-icon layui-icon-password"></i>
</div>
<input type="password" name="password" value="" lay-verify="required" placeholder="密码"
autocomplete="off" class="layui-input" id="reg-password" lay-affix="eye">
</div>
</div>
<div class="layui-form-item demo-reg-item">
<div class="layui-input-wrap">
<div class="layui-input-prefix">
<i class="layui-icon layui-icon-password"></i>
</div>
<input type="password" name="confirmPassword" value="" lay-verify="required|confirmPassword"
placeholder="确认密码" autocomplete="off" class="layui-input" lay-affix="eye">
</div>
</div>
<div class="layui-form-item">
<button class="layui-btn layui-btn-fluid" lay-submit lay-filter="demo-reg">注册</button>
</div>
</div>
</form>
<script src="static/layui.js"></script>
<script>
layui.use(function () {
var $ = layui.$;
var form = layui.form;
var layer = layui.layer;
var util = layui.util;
form.verify({
confirmPassword: function (value, item) {
var passwordValue = $('#reg-password').val();
if (value !== passwordValue) {
return '两次密码输入不一致';
}
}
});
form.on('submit(demo-reg)', function (data) {
// AJAX 请求和其他逻辑...
return false;
});
});
</script>
</body>
</html>