本文是关于使用layui框架实现弹出层，弹出层里面放了日期选择的表单，仅为本人自己写的一些笔记
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" href="layui/css/layui.css" />
<!--<script type="text/javascript" src="layui/layui.js"></script>-->
<script type="text/javascript" src="layui/layui.all.js"></script>
<script type="text/ecmascript" src="layui/lay/modules/laydate.js"></script>
<script type="text/javascript" src="js/Jquery.js" ></script>
</head>
<body>
<div>
<button id="receipt" type="button" class="layui-btn" onclick="check()">已完成</button>
<button type="button" class="layui-btn layui-btn-normal">未完成</button>
</div>
<!--弹出框时间选择-->
<div id="time" class="layui-form">
<div class="layui-inline start-from">
<label class="layui-form-label">开始时间：</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" id="start" placeholder="yyyy-MM-dd">
</div>
</div>
<div class="layui-inline end-from">
<label class="layui-form-label">结束时间：</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" id="end" placeholder="yyyy-MM-dd">
</div>
<!--<button type="submit" class="layui-btn">确定</button>-->
</div>
</div>
<script type="text/javascript">
$('#receipt').on('click', function(){
layer.open({
type: 1,
title:'时间选择',
area: ['40%', '40%'],
shadeClose: true, //点击遮罩关闭
content:$('#time'),
btn:['确定','取消']
});
});
</script>
<script type="text/javascript">
$=layui.jquery
layui.use('laydate', function(){
var laydate1 = layui.laydate;
var laydate2=layui.laydate;
//执行一个laydate实例
laydate1.render({
elem: '#start' //指定元素
});
laydate2.render({
elem: '#end' //指定元素
});
});
</script>
</body>