空气日期选择器js:小时+2

air-datepicker js : hour+2

本文关键字:小时 js 日期 选择器 空气      更新时间:2023-09-26

我尝试将小时(+2h)设置为实际的一天,而不是其他的。

的例子:

今天是10月18日,时间:上午10点

  • 如果我点击(不改变日期)->时间是12pm。
  • 如果我点击并选择明天(10月19日)->我可以选择任何时间。

今天是10月19日,时间:08:00

  • 如果我点击(不改变日期)->时间是上午10点。
  • 如果我点击并选择明天(10月20日)->我可以选择任何时间

PS:如果可能的话,我想禁用输入中的条目(因为我们可以改变时间)

Thx

    var start = new Date()
	var hour = start.getHours()+2;
	
	$('#date').datepicker({
        language: 'en',
		timepicker: true,
		minHours: hour
	})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/air-datepicker/2.2.3/js/datepicker.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/air-datepicker/2.2.3/js/i18n/datepicker.en.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/air-datepicker/2.2.3/css/datepicker.css" rel="stylesheet"/>
<input type='text' id="date" class="" />

编辑:我以为你想取消以前的约会(一切

试一试:

var start = new Date();
// first available date and time
start.setHours(start.getHours() + 2);
$('#date').datepicker({
  language: 'en',
  timepicker: true,
  minDate: start,
  onSelect: function(fd, d, picker) {
    if (d < start) {
      return;
    }
    if (d.getDate() == start.getDate() &&
      d.getMonth() == start.getMonth() &&
      d.getYear() == start.getYear()) {
      // set minHours to start hours
      picker.update({
        minHours: start.getHours()
      });
    } else {
      // set minHours to 0 hours
      picker.update({
        minHours: 0
      });
    }
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/air-datepicker/2.2.3/js/datepicker.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/air-datepicker/2.2.3/js/i18n/datepicker.en.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/air-datepicker/2.2.3/css/datepicker.css" rel="stylesheet" />
<input type='text' id="date" class="" />

还有,空气时间选择器docs: http://t1m0n.name/air-datepicker/docs/