laydate 时间范围的限制

laydate 使用版本号:laydate-v5.0.9

1.png

2.png

3.png

4.png

5.png
html 元素:
 
选择开始日期:
选择结束日期:
确定
取消


重置 laydate样式

.layui-laydate-header i,
 .layui-laydate-content table{
    font-size: 13px!important;
  }
.layui-laydate-footer span:hover{
    color: #0079c4!important;
 }

js代码修改:
要么把 btns:['clear', 'confirm'],要么把 showBottom: false 选择 现在 会解除限制
注:选择更换时间的时候,会按照选择框的时间 来做 active 状态,minmax 还是可以的

testObj = {
    init: function(){
        this.bindEvent();
    },
    bindEvent: function(){
        // 开始时间
        var start = laydate.render({
            elem: '#startDate',
            theme: '#0079c4',
            trigger: 'click',
            btns: ['clear', 'confirm'],
            // showBottom: false,
            done: function (value, date) {
                end.config.min = {
                    year: date.year,
                    month: date.month - 1,
                    date: date.date,
                    hours: date.hours,
                    minutes: date.minutes,
                    seconds: date.seconds
                };
                // 作为 结束选择 的 开始时间
                end.config.value = value;
            }
        });
        // 结束时间
        var end = laydate.render({
            // 绑定元素
            elem: '#endDate',
            //  主题色
            theme: '#0079c4',
            //  触发方式
            trigger: 'click',
            // 底部按钮
            btns: ['clear', 'confirm'],
            // showBottom: false,
            // 选择完成回调
            done: function (value, date) {
                start.config.max = {
                    year: date.year,
                    month: date.month - 1,
                    date: date.date,
                    hours: date.hours,
                    minutes: date.minutes,
                    seconds: date.seconds
                };
                start.config.value = value;
            }
        });
        laydate.render(start);
        laydate.render(end);
    }
}
testObj.init()

你可能感兴趣的:(laydate 时间范围的限制)