首先我们有开始时间和结束时间：
<div class="col-sm-6"><div class="form-group"><label class="col-sm-4 control-label"><@ctx.i18n text = "开始时间"/><font color="red">*</font>：</label><div class="col-sm-8"><div class="input-group date"><span class="input-group-addon"><i class="fa fa-calendar"></i></span><input class="form-control time-input" autocomplete="off" name="startTime" id="startTime" data-type="datetime"data-format="yyyy-MM-dd HH:mm:ss" type="text"/></div></div></div></div>
<div class="col-sm-6"><div class="form-group"><label class="col-sm-4 control-label"><@ctx.i18n text = "结束时间"/><font color="red">*</font>：</label><div class="col-sm-8"><div class="input-group date"><span class="input-group-addon"><i class="fa fa-calendar"></i></span><input class="form-control time-input" autocomplete="off" name="endTime" id="endTime" data-type="datetime"data-format="yyyy-MM-dd HH:mm:ss" type="text" data-callback="chgCallback"/></div></div></div></div>
上面的两段代码是我直接从项目里面拿出来的，其实这样写开始时间和结束时间已经完全可以实现了，因为属性写的比较全，下面是这两段代码所实现的功能：
我们可以看到，当我们选择时间时，默认高亮今天日期，点击‘选择时间’，可以选择时分秒，这些是最基础的实现，就不赘叙了！
好的，现在回归正题，我想要在选择开始时间时，点击 ' 选择时间 ' 时，默认高亮的时间点是早上八点（因为此时是默认停留在00:00:00），并且我想要选完开始时间之后，再选择结束时间时，实现小于开始时间的结束时间不可选，也就是说，我想要实现开始时间选好后，重置结束时间的最小值，那么看代码：
layui.use('laydate', function() {var laydate = layui.laydate;var start = laydate.render({elem: '#startTime',type:'datetime',ready: function(date){//设置默认值,选择日期不选择时分秒时的默认值this.dateTime.hours=08;this.dateTime.minutes=00;this.dateTime.seconds=00;}, done : function(value, date, endDate) {end.config.min = {year : date.year,month : date.month - 1,date : date.date,hours : date.hours,minutes : date.minutes,seconds : date.seconds}; //开始日选好后，重置结束日的最小日期}})var end = laydate.render({elem: '#endTime', type: 'datetime'});})
上面的代码可实现选择好开始时间之后，再选择结束时间时，小于开始时间的时间不可选的功能，那么我们再延伸一下，如果此时我们再选择开始时间时，想要实现大于结束时间的时间不可选怎么办呢，那就加一行代码：
, done: function (value, date, endDate) {start.config.max = {year: date.year,month: date.month - 1,date: date.date,hours: date.hours,minutes: date.minutes,seconds: date.seconds}; //结束日选好后，重置开始日的最大日期}
这段代码就是实现选择好结束时间时，再去选择开始时间，开始时间大于结束时间的日期时间不可选，那么我再把完整的实现代码粘一下：
layui.use('laydate', function() {var laydate = layui.laydate;var start = laydate.render({elem: '#startTime',type:'datetime',ready: function(date){//设置默认值,选择日期不选择时分秒时的默认值this.dateTime.hours=08;this.dateTime.minutes=00;this.dateTime.seconds=00;}, done : function(value, date, endDate) {end.config.min = {year : date.year,month : date.month - 1,date : date.date,hours : date.hours,minutes : date.minutes,seconds : date.seconds}; //开始日选好后，重置结束日的最小日期}})var end = laydate.render({elem: '#endTime', type: 'datetime', done: function (value, date, endDate) {start.config.max = {year: date.year,month: date.month - 1,date: date.date,hours: date.hours,minutes: date.minutes,seconds: date.seconds}; //结束日选好后，重置开始日的最大日期}});})
上面的代码就是实现：当我们选择好开始时间时，重置结束时间的最小日期，小于开始时间的结束时间便不可选了！当我们有了结束时间，再去选择开始时间时，重置开始时间的最大日期，大于结束时间的开始时间便不可选了！
那么我们再去页面看一下效果：当我们开始时间选择的是2002-6-17 08:15时，结束日期小于这个时间的便不可选：
反之亦然，另外简单说一下，datetime的类型是年月日时分秒这个大家都知道，虽然我已经在上面那个div里面写上了 'data-type="datetime" '，这句代码肯定是生效的，但是当我们在下面引用的时候，"type: 'datetime' ",这个类型还是要再写一下的
以上就是今天所分享的内容了，有需要的可以根据自己的代码适当的增减，我写的比较详细，不难看明白！
如果觉得《laydate时间控件：开始时间 结束时间最大最小值 设置默认时分秒》对你有帮助，请点赞、收藏，并留下你的观点哦！
