bootstrap daterangepicker限制过去日期时禁选过去时间解决办法

问题原因 #

你当前配置中minDate: new Date()会生成精确到当前时分秒的时间对象，daterangepicker默认会禁用所有早于该精确时间点的选项，因此当天已经过去的时段会被一并置为不可选状态，和预期效果不符。

方案1：调整minDate取值（最简便，无需额外逻辑） #

不需要废弃minDate配置，只要把minDate的取值设置为当日零点即可，组件会自动禁用所有早于当日零点的日期（即昨天及更早的历史日期），当天0点到23:59的所有时间选项都会保持可选状态。
修正后的完整代码：

$(function() {
  $('input[name="datetimes"]').daterangepicker({
    timePicker: true,
    // 核心修改：minDate取当日零点，而非当前精确时间
    minDate: moment().startOf('day'),
    startDate: moment().startOf('hour'),
    endDate: moment().startOf('hour').add(32, 'hour'),
    locale: {
      format: 'M/DD hh:mm A'
    }
  });
});

方案2：自定义isInvalidDate校验（不依赖minDate，扩展性更强） #

如果不想使用minDate配置，可以通过组件自带的isInvalidDate回调自定义日期禁用规则，这个钩子只会处理日期维度的可选性校验，不会干涉时间选择器的时段可选状态。
实现逻辑为：判断传入日期是否早于当日零点，是则返回true标记为不可选，否则返回false允许选择，完整代码如下：

$(function() {
  $('input[name="datetimes"]').daterangepicker({
    timePicker: true,
    // 移除minDate配置，改用自定义日期校验规则
    isInvalidDate: function(date) {
      // 仅禁用早于当日零点的历史日期，当天所有时段均可选择
      return date.isBefore(moment().startOf('day'));
    },
    startDate: moment().startOf('hour'),
    endDate: moment().startOf('hour').add(32, 'hour'),
    locale: {
      format: 'M/DD hh:mm A'
    }
  });
});

效果说明 #

两种方案实现效果完全一致：

• 昨天及之前的历史日期全部置为不可选
• 当天0点到24点的所有时段（包含已过去的时间）均支持选择
• 未来日期、时间的选择不受任何限制

如果后续需要叠加其他日期禁用规则（比如禁用周末、特定节假日、固定不可选日期段），优先选择方案2，直接在isInvalidDate回调里追加判断逻辑即可，维护成本更低。

内容的提问来源于stack exchange，提问作者user11469175