layui 时间选择器实现区间段筛选效果

8 篇文章 0 订阅
2 篇文章 0 订阅

项目中常会用到时间选择器,但是找了一下layui的官方文档时间选择器是独立的存在,但是要实现end时间选择器max为start选择器最终选择时间,还需要在done(选中)事件做下一步处理

废话不多说。直接上代码

/**
  * @description: layui的时间区间选择限值函数
  * @param {start:开始时间选择器id,end:结束时间选择器id,} 
  * @return: min,max
  */
 function TimeRange(start, end) {
     layui.use('laydate', function() {
     	var laydate ,endDate ,startDate;
         laydate = layui.laydate;
         //设置开始时间日期范围
         startDate = laydate.render({
             elem: start,
             max: 0, //设置一个默认最大值
             done: function(value, date) {
                 endDate.config.min = {
                     year: date.year,
                     month: date.month - 1, //关键
                     date: date.date,
                 };
             }
         });
		 //设置结束时间日期范围
         endDate = laydate.render({
             elem: end, //选择器结束时间
             min: "1970-1-1", //设置min默认最小值,
             max: 0,
             done: function(value, date) {
                 startDate.config.max = {
                     year: date.year,
                     month: date.month - 1, //关键
                     date: date.date,
                 }
             }
         });
     });
 }


  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值