layui 自定义日期选择器今日、昨日 、本周、本月、上个月等

本文主要是介绍layui 自定义日期选择器今日、昨日 、本周、本月、上个月等，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

1、layui 日期选择器

laydate日期选择器
<div class="layui-input-inline"><input class="layui-input" id="dateTime" placeholder="日期范围">
</div><script>
layui.use(['laydate'], function () {laydate.render({elem: '#dateTime',type: 'date',format: 'yyyy-MM-dd',range: true,trigger: 'click',done: function (val, stdate, ovdate) {}});
});

正常显示

2、自定义laydate.js

文件下载地址
链接：https://pan.baidu.com/s/1-revW0FTwOprM361e-1eLw 
提取码：qkntvar startDate1 = new Date(new Date().setDate(1));
//定义接收上个月的第一天和最后一天
var startDate2 = new Date(new Date(new Date().setMonth(new Date().getMonth() - 1)).setDate(1));
var endDate2 = new Date(new Date().setDate(0));
var now = new Date(); //今日
var nowDayOfWeek = now.getDay(); //今天本周的第几天
laydate.render({elem: this, //指定元素range: true,type: 'date',format: 'yyyy-MM-dd',trigger: 'click', //采用click弹出value: '',extrabtns: [{id: 'today', text: '今日', range: [now, now]},{id: 'yesterday',	text: '昨日', range: [new Date(new Date().setDate(new  Date().getDate() - 1)), new Date(new Date().setDate(new Date().getDate() - 1))]},{id: 'week',text: '本周',range: [new Date(new Date().setDate(new Date().getDate() - nowDayOfWeek + 1)), new Date()]},{id: 'lastday-7',text: '过去7天',range: [new Date(new Date().setDate(new Date().getDate() - 7)), new Date(new Date().setDate(new Date().getDate() - 1))]},{id: 'lastday-30',text: '过去30天',range: [new Date(new Date().setDate(new Date().getDate() - 30)), new Date(new Date().setDate(new Date().getDate() - 1))]},{id: 'thismonth', text: '本月', range: [startDate1, now]},{id: 'lastmonth', text: '上个月', range: [startDate2, endDate2]}],done: function (val, stdate, ovdate) {// 确认选择事件后调用}
});

效果图

这篇关于layui 自定义日期选择器今日、昨日 、本周、本月、上个月等的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---