摘要:layui表单弹出设计,可以在后台直接打开弹出窗口,减少页面的切换,方便管理。<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title
layui表单弹出设计,可以在后台直接打开弹出窗口,减少页面的切换,方便管理。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>layui作业</title>
<link rel="stylesheet" type="text/css" href="../layui/css/layui.css" />
<script type="text/javascript" src="../layui/layui.js"></script>
</head>
<form class="layui-form" action="" style="padding:10px;">
<div class="layui-form-item">
<label class="layui-form-label">用 户 名</label>
<div class="layui-input-inline">
<input type="text" name="username" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">真实姓名</label>
<div class="layui-input-inline">
<input type="text" name="realname" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">权限分配</label>
<div class="layui-input-inline">
<select name="rightset">
<option value=""></option>
<option value="0">超级管理员</option>
<option value="1">栏目管理员</option>
<option value="2">用户管理员</option>
</select>
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">验证邮箱</label>
<div class="layui-input-inline">
<input type="text" name="email" class="layui-input">
</div>
</div>
</div>
<button class="layui-btn" style="margin-left:40px;">
<i class="layui-icon"></i> 添加
</button>
</form>
<script>
//form表单核心js
layui.use('form', function(){
var form = layui.form;
});
</script>
</body>
</html>
批改老师:韦小宝批改时间:2018-12-17 16:30:33
老师总结:写的很不错!layui弹出层还是比较有代表性的!课后记得多练习才可以哦!