abstract:<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>添加</title> <link rel="stylesheet" type="text/css"&n
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>添加</title> <link rel="stylesheet" type="text/css" href="static/layui/css/layui.css"> <script type="text/javascript" src="static/layui/layui.js"></script> </head> <body style="padding: 10px;"> <div style="border-bottom: 1px solid #009688;"> <span style="color: #fff;margin-left: 20px;line-height: 30px;background: #009688;padding: 5px;">添加用户</span> </div> <form action=""> <div> <label>名字</label> <div> <input type="text" name="title" required lay-verify="required" placeholder="请输入名字" autocomplete="off"> </div> </div> <div> <label>密码框</label> <div> <input type="password" name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off"> </div> <!-- <div class="layui-form-mid layui-word-aux">辅助文字</div> --> </div> <div> <label>年龄</label> <div> <input type="password" name="password" required lay-verify="required" placeholder="请输入年龄" autocomplete="off"> </div> <!-- <div class="layui-form-mid layui-word-aux">辅助文字</div> --> </div> <div> <label>权限</label> <div> <select name="city" lay-verify="required"> <option value=""></option> <option value="0">一般用户</option> <option value="1">高级用户</option> <option value="2">赞助用户</option> <option value="3">管理员</option> <option value="4">系统管理员</option> </select> </div> </div> <div> <label>状态</label> <div> <input type="checkbox" name="like[write]" title="禁用"> <input type="checkbox" name="like[read]" title="正常" checked> </div> </div> <div> <label>单选框</label> <div> <input type="radio" name="sex" value="男" title="男"> <input type="radio" name="sex" value="女" title="女" checked> </div> </div> <div> <div> <button lay-submit lay-filter="formDemo">立即提交</button> <button type="reset" class="layui-btn layui-btn-primary">重置</button> </div> </div> </form> <script> //Demo layui.use('form', function(){ var form = layui.form; //监听提交 form.on('submit(formDemo)', function(data){ layer.msg(JSON.stringify(data.field)); return false; }); }); </script> </body> </html>
Correcting teacher:天蓬老师Correction time:2019-03-28 10:03:44
Teacher's summary:弹层的作用, 就是让用户在不离开当页面的情况下, 实现更多的操作, 提升用户体验 , 是SPA应用的基础