根据位置/日期更改日期选择器中的时间

Question

我正在使用amsul date selector and a time selector，我想根据选中的日期和复选框更改时间选择器的最小/最大小时数。这是我的代码：

    var today = new Date();
    var tomorrow = new Date();
    tomorrow.setDate(today.getDate()+1);
    var nextyear=new Date();
    nextyear.setFullYear(nextyear.getFullYear()+1);
    pickupdatemin=new Date(document.getElementById('car-rental-pickup-date').value);

const timepicker = $('#car-rental-pickup-time').pickatime({
    clear: '',
    min: [9,00],
    max: [16,30],
    onSet: function(context) {
      getpricing();
    }
});
    const pickupdatepicker = $('#car-rental-pickup-date').pickadate({
        format: 'mm/dd/yyyy',
        min: tomorrow,
        max: nextyear,
        today: '',
        close: '',
        clear: '',
        disable: [1],

        onSet:function(context){
            var pickup_loc_sel = document.getElementsByName('car-rental-pickup-location');
            var pickup_loc;
            for(var i = 0; i < pickup_loc_sel.length; i++){
            if(pickup_loc_sel[i].checked){
            pickup_loc = pickup_loc_sel[i].value;
        }
    }
          var d = new Date(context.select);
          var isSat = d.getDay() == 6 && pickup_loc == "sf";
          var max = isSat ? [11,30] : [16,30];
          var time = timepicker.pickatime('picker');
          time.clear().set({max});


          var ddate = dropdatepicker.pickadate('picker');
          ddate.clear();
          ddate.set('min', d);



          getpricing();
        }
    });

所以现在代码工作得很好，我想要改变的是除了我拥有的所有东西（我可以在这里之前的海报的帮助下完成剩下的工作），如果@987654325 @我希望可用的日期是星期一、星期二、星期四、星期五，我希望可用的时间是上午 11 点到下午 2 点。我该怎么做呢？

编辑：Here is a working jsfiddle

Answer 1

像这样：

var today = new Date();
var tomorrow = new Date();
tomorrow.setDate(today.getDate()+1);
var nextyear=new Date();
nextyear.setFullYear(nextyear.getFullYear()+1);
pickupdatemin=new Date(document.getElementById('car-rental-pickup-date').value);

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

var pickupdatepicker = $('#car-rental-pickup-date').pickadate({
    format: 'mm/dd/yyyy',
    min: tomorrow,
    max: nextyear,
    today: '',
    close: '',
    clear: '',
    disable: [1],
    onSet:function(context){
        updateTimePicker();
    }        

});

$("input[type=radio]").change(function() {
    updateDatePicker();
});

function updateDatePicker(){

    var radioValue = $("input[type=radio]:checked").val();
    var dPicker = pickupdatepicker.pickadate('picker');

    switch (radioValue){

        case "oc":

            dPicker.set({
              'enable': [2,3,5],
              'disable': [1,4,6,7]
            }); 

            break;

        default:

            dPicker.set({
              'enable': [2,3,4,5,6,7],
              'disable': [1]
            });

    }

    updateTimePicker();

}

function updateTimePicker(){

    var radioValue = $("input[type=radio]:checked").val();
    var dPicker = pickupdatepicker.pickadate('picker');
    var tPicker = timepicker.pickatime('picker');

    switch (radioValue){

        case "oc":

            tPicker.set({
                'min': [11,0],
                'max': [14,0]
            });   

            break;

         case "sf":

            if (dPicker.get('select') != null && dPicker.get('select').day == 6){

                tPicker.set({
                    'min': [9,0],
                    'max': [11,30]
                });                 

                break;

             }

             default:

             tPicker.set({
                 'min': [9,0],
                 'max': [16,30]
             });

    }

}

And here is a working fiddle

Answer 2

我为您的单选按钮添加了一个功能，我认为您在设置日期时也在操纵时间选择器。因此，您必须构建一个函数来在日期更改和位置更改时调用，并将它们整理到一个函数中以提高一致性，现在新函数将处理您的时间选择器，但是一旦您选择了日期，这些将被覆盖通过您的日期开始函数。

这不是准确的代码，只是为了帮助您确定下一步行动。

function placeEvents() {
  var pickup_loc_sel = document.getElementsByName('car-rental-pickup-location');
  for (var i = 0; i < pickup_loc_sel.length; i++) {
    /* if (pickup_loc_sel[i].checked) {
      pickup_loc = pickup_loc_sel[i].value;
    } */
    pickup_loc_sel[i].addEventListener('change', function(e){
      var max = [16, 30];
      var min = [9, 00];
      if(e.target.value === 'oc') {
        min = [11, 0];
        max = [14, 0]; 
      }
      var time = timepicker.pickatime('picker');
      time.clear().set({
        max, min
      });

      disable = e.target.value === 'oc' ? [1, 4, 6] : [1]; 
      var date = pickupdatepicker.pickatime('picker');
      date.clear().set({
        disable
      })
    })
  }
}

JS Fiddle 供您参考https://jsfiddle.net/9c6r1ns4/1/