Javascript日期范围选择器 - 范围选择的单个日历 [英] Javascript Date Range Picker - Single Calendar for Range Selection

问题描述

我正在使用此日期范围选择器组件： http://www.daterangepicker.com/ 默认情况下，小部件显示两个日历。我想只显示一个日历，并能够使用< >选择开始日期和结束日期时选择下一个/上个月的按钮，即能够选择1月份的开始日期（仅显示1月份），然后通过单击>按钮选择3月份的结束日期（仅显示3月份）。 singleDatePicker有一个选项：true，但这会禁用选择日期范围的能力。

I'm using this date range picker component: http://www.daterangepicker.com/ and by default the widget shows two calendars. I would like to show only one calendar and be able to use the < > buttons to select next/previous months when selecting start and end dates i.e., be able to select a start date in January (showing only January) and then select an end date in March (showing only March), by clicking the > button. There is an option for singleDatePicker: true, but this disables the ability to select a range of dates.

推荐答案

我也有同样的问题，但通过添加一些CSS来克服它，希望它也可以帮助你。

I was also having the same problem but overcome it with adding some css in it, hope it also helps you.

.drp-calendar.right thead>tr:nth-child(2) {
    display: none;
}
.drp-calendar.right tbody {
    display: none;
}
.daterangepicker.ltr .ranges, .daterangepicker.ltr .drp-calendar {
    float: none !important;
}
.daterangepicker .drp-calendar.right .daterangepicker_input {
    position: absolute;
    top: 45px;
    left: 8px;
    width: 230px;
}
.drp-calendar.left .drp-calendar-table {
    margin-top: 45px;
}

这篇关于Javascript日期范围选择器 - 范围选择的单个日历的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！