需求：页面中有多个地方需要设置日期，所以选择了layui的 laydate控件。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="../jquery/v3.2.1/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="../laydate/v5.0.9/laydate/laydate.js"></script>
</head>
<body>
<div class="">
日期1：
<input type="text" class="J-startTime" value="" placeholder="请选择开始日期" readonly="readonly">
<span class="from-to"> - </span>
<input type="text" class="J-endTime" value="" placeholder="请选择结束日期" readonly="readonly">
</div>
<div class="">
日期2：
<input type="text" class="J-startTime" value="" placeholder="请选择开始日期" readonly="readonly">
<span class="from-to"> - </span>
<input type="text" class="J-endTime" value="" placeholder="请选择结束日期" readonly="readonly">
</div>
</body>
</html>
问题：但是在点击第二个“日期选择框”时，生成的选择框只是显示一下就消失了，参考网上的资料，是由于我们点击了“日期选择框”后 ，laydate会给input框增加一个 lay-key=”1”。
解决方法：通过类选择“日期选择框”，遍历循环创建实例。
$(function () {
//遍历循环创建实例
$('.J-startTime').each(function(index){
var _this=this;
laydate.render({
elem: _this,
done: function(value, date){
}
});
});
$('.J-endTime').each(function (index) {
var _this=this;
endDate[index]=laydate.render({
elem:_this,
});
});
});