layui弹出表单

原创 2019-02-18 17:44:01 343
摘要:<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title>    <link rel="styl

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Title</title>
   <link rel="stylesheet" href="layui/css/layui.css">
   <script src="layui/layui.js"></script>
</head>
<body>
<form action="" class="layui-form">
   <div class="layui-form-item">
   <label class="layui-form-label">姓名</label>
   <div class="layui-input-inline">
       <input type="password" name="password"  class="layui-input">
   </div>
   </div>
   <div class="layui-form-item">
       <label class="layui-form-label">年龄</label>
       <div class="layui-input-inline">
           <input type="password" name="password"  class="layui-input">
       </div>

   </div>
   <div class="layui-form-item">
   <label class="layui-form-label">性别</label>
   <div class="layui-input-inline">
       <select name="city" lay-verify="">
           <option value="">请选择一个城市</option>
           <option value="010">男</option>
           <option value="021">女</option>
           <option value="021">未知</option>
       </select>
   </div>
</div>
   <div class="layui-form-item">
       <label class="layui-form-label">状态</label>
       <div class="layui-input-inline">
           <input type="checkbox" title="正常" checked lay-skin="primary">
       </div>
   </div>
   <div class="layui-form-item">
       <div class="layui-input-block">
           <button class="layui-btn">保存</button>
       </div>
   </div>

</form>
<script>
   //Demo
layui.use('form', function(){
       var form = layui.form;

   });
</script>
</body>
</html>微信截图_20190218174236.png

批改老师:灭绝师太批改时间:2019-02-18 17:45:24
老师总结:作业的完成速度很快,虽然layui简单,但是还是要掌握哦,不要求快,囫囵吞枣

发布手记

热门词条