LayUI之时间控件

最近又接触到了layui这个东西，虽然以前也接触过，但毕竟不是专业的，既然现在又用到了，那就记录一下吧。

引入啥的这里就不做介绍了（门外汉不班门弄斧了），可以自行补脑。。。

这里只说一下时间控件的问题：

//开始时间   readonly="" 限制不能手动输入，只能选择日期
<div class="layui-input-inline">
         <input type="text" name="startTime" placeholder="开始时间" id="startTime"
               autocomplete="off" class="layui-input" readonly="">
</div>

--结束时间
<div class="layui-input-inline">
       <input type="text" name="endTime" placeholder="结束时间" id="endTime"
           autocomplete="off" class="layui-input" readonly="">
</div>

用上面这个为例：

首先，我设置开始时间只能选择当前时间，用一个函数限制：

// 设置最小可选的日期
    function minDate() {
        var now = new Date();
        return now.getFullYear() + "-" + (now.getMonth() + 1) + "-" + now.getDate();
    }

然后，又限制一下，开始时间和结束时间的一些互斥，最后呈现

var startTime = laydate.render({
        elem: '#startTime'
        ,trigger: 'click'
        ,min:minDate(),//函数
        done: function (value, date) {
           if (value !== '') {
               endTime.config.min.year = date.year;
               endTime.config.min.month = date.month - 1;
               endTime.config.min.date = date.date;
               } else {
               endTime.config.min.year = '';
               endTime.config.min.month = '';
               endTime.config.min.date = '';
               }
       }
    });
    var endTime = laydate.render({
        elem: '#endTime'
        ,trigger: 'click'
        ,min:minDate(),//函数
        done: function (value, date) {
            if (value !== '') {
                startTime.config.max.year = date.year;
                startTime.config.max.month = date.month - 1;
                startTime.config.max.date = date.date;
                } else {
                startTime.config.max.year = '';
                startTime.config.max.month = '';
                startTime.config.max.date = '';
                 }
        }
    });

可能还会有更简单的方法，欢迎补充，最终效果