<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>首页</title> </head> <body> <div class="layui-anim layui-anim-scaleSpring"> <div class="layui-container"> <div class="layui-row" style="margin-top: 255px;"> <div class="layui-col-xs4 layui-col-sm12 layui-col-md4"> <form class="layui-form layui-form-pane"> <label class="layui-form-label">账号</label> <div class="layui-input-block"> <input type="text" id="uname" required lay-verify="required" placeholder="请输入账号" autocomplete="off" class="layui-input"> </div> <label class="layui-form-label" style="margin-top: 10px">密码</label> <div class="layui-input-block" style="margin-top: 10px"> <input type="password" id="pass" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> </div> <div class="layui-form-item" style="margin-top: 10px"> <div class="layui-input-block"> <input type="button" class="layui-btn" lay-submit lay-filter="formDemo" onclick="login()" value="登录"/> <input type="button" class="layui-btn layui-btn-primary" onclick="reg()" value="注册"/> <input type="button" class="layui-btn layui-btn-primary" onclick="getpassword()" value="忘记密码"/> </div> </div> </form> </div> </div> </div> </div> <div style="bottom: 10px; left: 30%; position: fixed;"> <!-- 底部固定区域 --> <a href="http://beian.miit.gov.cn/">湘ICP备16005656号-2</a> </div> </body> <link rel="stylesheet" href="../static/layui/css/layui.css"> <script type="text/javascript" src="../static/layui/layui.all.js"></script> <script type="text/javascript" src="../static/js/jquery-3.2.1.js"></script> <script type="text/javascript"> var layer = layui.layer; function reg() { layui.use('layer', function(){ layer.open({ title: '用户注册' ,content: '<input type="text" id="regUname" required lay-verify="required" placeholder="请输入账号" autocomplete="off" class="layui-input">' +'<input type="text" id="uuname" required lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input" style="margin-top: 10px">' +'<input type="password" id="regPass" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input" style="margin-top: 10px">' +'<input type="password" id="repass" required lay-verify="required" placeholder="请再输入一次密码" autocomplete="off" class="layui-input" style="margin-top: 10px">' +'<a href="#" style="color: #0000FF">阅读用户协议</a>' ,btn: ['提交','取消'] ,btn1:function(index,layero){ var uname=$('#regUname').val(); var pass=$('#regPass').val(); var repass=$('#repass').val(); var uuname=$('#uuname').val(); if(pass!=repass){ alert('两次密码不一致'); return; } $.post('/user/reg.do', {uname:uuname,pass:pass,name:uname}, function(data) { layer.open({ title:"注册成功", content:"欢迎您注册,请尽早填写邮箱", yes:function(index,obj){ layer.close(index); } }) }); } ,btn2:function(index){ } }); }); } function login() { var name=$('#uname').val(); var pass=$('#pass').val(); console.log("name:"+name+" pass:"+pass); $.post('/user/login.do',{uname:name,pass:pass},function(data){ console.log(data); var json=JSON.parse(data); if(json.code==102){ layer.open({ title: '还没注册?', content:'似乎你还没注册呢,先注册吧', btn:['现在注册','下次吧'], btn1:function(index){ reg(); }, btn2: function(index){ } }) }else if(json.code==100){ window.location.replace('home.html'); }else { layer.open({ title: '错误', content:json.msg, btn:['确定'], btn1:function(index){ layer.close(index); }, }) } }); } function getpassword(){ layer.open({ title:"找回密码", content:"请输入账号<p><input type='text' id='uname_' required lay-verify='required' placeholder='请输入账号' autocomplete='off' class='layui-input'>", yes:function(index,obj){ var uname=$('#uname_').val(); $.post("/user/repassword.do?name=" + uname, function(data) { var json = JSON.parse(data); layer.alert(json.msg); }) layer.close(index) layer.msg("正在提交") }, }) } </script> </html>