Jquery UI DateTimePicker 将 3 天添加到当前日期并使用 dp.change 方法禁用 datePickerStart 和 datePickerEnd 日期中的未来日期

Posted 2023-05-08

【中文标题】Jquery UI DateTimePicker 将 3 天添加到当前日期并使用 dp.change 方法禁用 datePickerStart 和 datePickerEnd 日期中的未来日期

【英文标题】：Jquery UI DateTimePicker add 3 days to current date and disable the future dates in datePickerStart and datePickerEnd date with dp.change method

【发布时间】：2020-02-09 11:34:57

【问题描述】：

所以，在对堆栈溢出进行了大量搜索之后，我没有为下面的代码找到更好的解决方案。我的实际问题是，我有 datetimepicker，我想在 datePickerStart 上添加 3 天并禁用它的过去日期，同样使用 dp.change 我希望当前日期的这 3 天显示在下一个 datetimepicker 中，即 @987654323 @ 并禁用它的过去和未来日期，除了添加的 3 天。我的意思是说只在下一个选择器中显示 3 天。例如，如果用户选择了 12 个日期，那么它应该在下一个选择器中显示 12 到 14 个日期，如果用户选择第 21 个日期，那么它应该在下一个选择器中显示 21 到 23 个日期，依此类推。按照我编写的代码可以正常工作，但不能使用上述功能。

$('.datePickerStart').datetimepicker(
    format: 'DD-MM-YYYY',
    minDate: new Date()
).on('dp.change', function(e)
    var parent = $($(this).parents('.row')[0]),
        endDate = parent.find('.datePickerEnd');
    endDate.data("DateTimePicker").minDate(e.date).show();
);

$('.datePickerEnd').datetimepicker(
    format: 'DD-MM-YYYY',
    minDate: new Date(),
    useCurrent: false
).on('dp.change', function(e)
    var parent = $($(this).parents('.row')[0]),
        startDate = parent.find('.datePickerStart');
    startDate.data("DateTimePicker").maxDate(e.date);
);

任何帮助将不胜感激。提前致谢。

【参考方案1】：

希望这会有所帮助！

$(function() 
  $('.datePickerStart').datetimepicker(
  minDate: new Date()
  );
  $('.datePickerEnd').datetimepicker();
  $(".datePickerStart").on("dp.change", function(e) 
    $('.datePickerEnd').data("DateTimePicker").minDate(e.date);
      var dt = new Date(e.date);
      dt.setDate(dt.getDate() + 2);
      $('.datePickerEnd').data("DateTimePicker").maxDate(dt);
  );
);

Fiddle

【讨论】：

我已经完成了，回复晚了，但是感谢它的工作兄弟，它可能会帮助其他人。