【问题标题】:Daterangepicker - singleDatePicker - Show 2 monthsDaterangepicker - singleDatePicker - 显示 2 个月
【发布时间】:2017-06-26 07:13:45
【问题描述】:

我正在使用daterangepicker。一切正常。

现在"singleDatePicker": true可以显示2个月的范围吗?

HTML:

<input class="form-control input-lg" id="tripOne" name="tripOne" />

JS:

var nowDate = new Date();
var today = new Date(nowDate.getFullYear(), nowDate.getMonth(), nowDate.getDate(), 0, 0, 0, 0);
var maxLimitDate = new Date(nowDate.getFullYear() + 1, nowDate.getMonth(), nowDate.getDate(), 0, 0, 0, 0);

$('input[name="tripOne"]').daterangepicker({
"autoApply": true,
"autoUpdateInput": false,
"singleDatePicker": true,
"minDate": today,
"maxDate": maxLimitDate,
"opens": "left",
"locale": {
    format: 'DD MMM YYYY'
  }
}, function (start, end) {
  $("#tripOne").val(start.format('DD MMM YYYY'));
  $('#tripOne').parent().parent().removeClass('has-error');
});

【问题讨论】:

  • 可以,但是如果你从右边的日历中选择一个日期,这个日历切换到左边并显示下个月

标签: javascript jquery bootstrap-daterangepicker


【解决方案1】:

要使用 singleDatePicker 显示两个月,请添加 $('.calendar.right').show();

Fiddle

要隐藏右箭头,请编辑 daterangepicker.js

找到这一行,

if ((!maxDate || maxDate.isAfter(calendar.lastDay)) && (!this.linkedCalendars || side == 'right' || this.singleDatePicker))

并删除|| this.singleDatePicker

这将隐藏第一个日历上的右箭头。

【讨论】:

    【解决方案2】:

    除了 Indrajeet Patil 的回答。可以通过以下方式隐藏左侧日历中的右箭头:

    $('.calendar.left .next.available').hide();
    

    【讨论】:

      猜你喜欢
      • 2015-08-17
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-08-05
      • 2023-04-04
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多