ThinkChat🤖让你学习和工作更高效,注册即送10W Token,即刻开启你的AI之旅 广告
## 日期区间列表 daterangepicker 参考文档: [http://www.daterangepicker.com/](http://www.daterangepicker.com/) [TOC] ![](https://box.kancloud.cn/f4308d16dd7b4e34c5a4734af9bb2ba3_602x345.png) ## 基本使用 ``` <input name="birthdate" value="2017-11-07 至 2017-12-22" class="form-control"/> <script> require(['hdjs'], function (hdjs) { hdjs.daterangepicker({ //标签元素 element: 'input[name="birthdate"]' }); }) </script> ``` ## 显示周与时间 ![](https://box.kancloud.cn/fb4a609a0ec645b2cec43585814e702a_685x377.png) ~~~ <input name="birthdate" value="2019-02-22 至 2020-3-22" class="form-control"/> <script> require(['hdjs', 'moment'], function (hdjs, moment) { hdjs.daterangepicker({ //标签元素 element: 'input[name="birthdate"]', //选项参考插件官网 options: { ranges: { //'最近1小时': [moment().subtract('hours',1), moment()], '今日': [moment().startOf('day'), moment()], '昨日': [moment().subtract('days', 1).startOf('day'), moment().subtract('days', 1).endOf('day')], '最近7日': [moment().subtract('days', 6), moment()], '最近30日': [moment().subtract('days', 29), moment()], '本月': [moment().startOf("month"), moment().endOf("month")], '上个月': [moment().subtract(1, "month").startOf("month"), moment().subtract(1, "month").endOf("month")] }, showDropdowns: true, alwaysShowCalendars: true, }, callback: function (start, end, label) { var str = start.format('YYYY-MM-DD') + ' 至 ' + end.format('YYYY-MM-DD'); console.log(str); } }); }) </script> ~~~