Question

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

$('#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/

Answer 1

您需要的所有内容都记录在文档的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">

Answer 2

您提供的信息很少，但是您可以尝试以下操作：

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

更改时间选择器的分钟/时间

2 个答案: