0

我有一个日期选择器和一个时间选择器，我想根据日期选择器中选择的日期来更改时间选择器的最小/最大小时数。这是我的代码：

$('#car-rental-pickup-date').pickadate({
    format: 'mm/dd/yyyy',
    min: tomorrow,
    max: nextyear,
    today: '',
    close: '',
    clear: '',
    disable: [
    1,
  ]


});

$('#car-rental-pickup-time').pickatime({
    clear: '',
    min: [9,00],
    max: [16,30]
});

我相信它遵循类似的东西

    var dropoff_date = new Date(document.getElementById("car-rental-pickup-date").value);
if ((dropoff_date.getDay() == 6) {
        min: [9,00],
        max: [11,30]
}{
        min: [9,00],
        max: [16,30]
}

但我无法让它发挥作用，建议？

编辑：我正在使用这个：https ://amsul.ca/pickadate.js/time/

4

2 回答 2

2

您需要的所有内容都记录在文档的API部分中，但简而言之，您需要：

  • 订阅onSet日期选择器上的事件，以便在日期更改时收到通知
  • 确定它是否是星期六（你有这个）。
  • max使用时间选择器的方法更新set时间。

忽略下面代码段中的所有导入，这是您需要的 javascript。

const timepicker = $('#car-rental-pickup-time').pickatime({
    clear: '',
    min: [9,00],
    max: [16,30]
});

var datepicker = $('#car-rental-pickup-date').pickadate({
    format: 'mm/dd/yyyy',
    min: new Date(2019,8,14),
    max: new Date(2020,8,13),
    today: '',
    close: '',
    clear: '',
    disable: [
      1,
    ],
    onSet:function(context){
      var d = new Date(context.select);
      var isSat = d.getDay() == 6;
      var max = isSat ? [11,30] : [16,30];
      var time = timepicker.pickatime('picker');
      time.clear().set({max});
    }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pickadate.js/3.6.4/compressed/picker.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pickadate.js/3.6.4/compressed/picker.date.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pickadate.js/3.6.4/compressed/picker.time.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/pickadate.js/3.6.4/compressed/themes/classic.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/pickadate.js/3.6.4/compressed/themes/classic.date.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/pickadate.js/3.6.4/compressed/themes/classic.time.css">
<input type="date" id="car-rental-pickup-date">
<input type="time" id="car-rental-pickup-time">

于 2019-09-13T08:28:07.487 回答
-1

您提供的信息非常少，但您可以尝试以下方法：

您可以在日期字段上创建 onChange 或 onBlur 事件，然后在此基础上您可以设置时间的最小值/最大值。

于 2019-09-13T07:58:32.443 回答