<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <title>合并版使用 - layui</title> <link rel="stylesheet" href="../build/css/layui.css"> <style> body{padding: 10px;} </style> </head> <body> <div id="demo1"></div> <button class="layui-btn demo" data-type="test">测试弹出式Form</button> <script src="../dist/layui.all.js"></script> <script> ;!function(){ var $ = layui.jquery ,layer = layui.layer ,form = layui.form ,laypage = layui.laypage; layer.ready(function(){ layer.msg('hello'); }); laypage.render({ elem: 'demo1' ,count: 100 //总页数 }); //触发事件 var active = { test: function(){ layer.open({ type: 1 ,resize: false ,content: ['<ul class="layui-form" style="margin: 10px;">' ,'<li class="layui-form-item">' ,'<label class="layui-form-label">邮箱激活</label>' ,'<div class="layui-input-block">' ,'<select name="activate">' ,'<option value="0">未激活</option>' ,'<option value="1">已激活</option>' ,'<select>' ,'</div>' ,'</li>' ,'<li class="layui-form-item" style="text-align:center;">' ,'<button type="submit" lay-submit lay-filter="*" class="layui-btn">提交</button>' ,'</li>' ,'</ul>'].join('') ,success: function(layero){ layero.find('.layui-layer-content').css('overflow', 'visible'); form.render().on('submit(*)', function(data){ layer.msg(JSON.stringify(data.field)); }); } }); } }; $('.demo').on('click', function(){ var type = $(this).data('type'); active[type] ? active[type].call(this) : ''; }); }(); </script> </body> </html>