layui 学习笔记(二)

1.时间选择器

  ->起始日期不能大于截止日期,截止日期不能小于起始日期

html:

<div class="layui-inline">
       <input id="startDate" class="layui-input test-item" type="text"  placeholder="起始日期"/>
</div>
<div class="layui-inline">
       <input id="endDate" class="layui-input test-item" type="text" placeholder="截止日期"/>
</div>

js:

//初始化时间
    layui.use('laydate', function(){
        var laydate = layui.laydate;
        /*lay('.test-item').each(function(){// 如果不需要大小的验证 就这样写就行了后面就不需要了
            laydate.render({
                elem: this
                ,trigger: 'click'
            });
        });*/
        var startDate = laydate.render({
            elem:'#startDate',
            type:'date',
            btns: ['clear','confirm'],
            done:function(value,date){
                if(value){
                    endDate.config.min={
                        year:date.year,
                        month:date.month-1,//关键
                        date:date.date,
                        hours:date.hours,
                        minutes:date.minutes,
                        seconds:date.seconds
                    };
                }else{
                    endDate.config.min=startDate.config.min;
                }
            }
        });
        var endDate=laydate.render({
            elem:'#endDate',
            type:'date',
            btns: ['clear','confirm'],
            done:function(value,date){
                if(value){
                    startDate.config.max={
                        year:date.year,
                        month:date.month-1,//关键
                        date:date.date,
                        hours:date.hours,
                        minutes:date.minutes,
                        seconds:date.seconds
                    }
                }else{
                    startDate.config.max=endDate.config.max;
                }
            }
        })
    });

猜你喜欢

转载自www.cnblogs.com/DarGi2019/p/12095036.html