Question

任务是餐馆的预订表格。除其中一家餐厅外，所有餐厅的残障时间均相同。所有餐厅都可以通过选择选项进行选择。 select字段已经具有一个名为show的js函数，用于不同的功能。

我已经创建了js，以在事先选择餐厅后将17和23之间的时间设置为禁用。

但是，我无法让选择器在更改时重新加载。我已经使用功能show（）和$（'＃Restaurant'）。change（function（）尝试过。我知道我没有告诉选择器更改值，但是我不确定如何更改。

<select name="Restaurant" id="Restaurant" onchange="show()" required data-msg-required="Please choose the restaurant"> 
        <?php  if (empty($_GET['Restaurant'])){echo '<option disabled selected 
    value="">Choose restaurant</option>';}?>
        <?php booking(); ?>
</select>


<script>
$(function () {
  $('#DatumZeit').datetimepicker({
    locale: 'en',
    minDate: moment().add(2, 'hours'),
    disabledHours: disabledtime,
    format: 'DD.MM.YYYY HH:mm',
    showClose: true,
    icons: {
        close: 'OK'
    },
    widgetPositioning: {
        horizontal: 'auto',
        vertical: 'bottom'
     },
   });
});


 function show(){
    if(document.getElementById('Restaurant').value == "Düsseldorf") {
       var currenttime  = moment();
       var timestart = moment().startOf('day').hour(10).add(7, 'hours');
       var timeend = moment().startOf('day').hour(10).add(13, 'hours');
                        console.log(timestart);
                        console.log(timeend);

        if (currenttime.isBetween(timestart, timeend)) {
          console.log('is between');
          var disabledtime= [10,9,8,7,6,5,4,3,2,1,00,24,23,17,18,19,20,21,22];

       } else {
          console.log('is not between');
          var disabledtime= [10,9,8,7,6,5,4,3,2,1,00,24,23];
      }                                       
    };
 }
</script>

Answer 1

也许可以帮助其他人：基本上，我使用了$（'＃DatumZeit'）。data（“ DateTimePicker”）。disabledHours。

  function show(){
      if(document.getElementById('Restaurant').value == "Düsseldorf") {
        var currenttime  = moment();
        var timestart = moment().startOf('day').hour(10).add(7, 'hours');
        var timeend = moment().startOf('day').hour(10).add(13, 'hours');

        if (currenttime.isBetween(timestart, timeend)) {
          $('#DatumZeit').data("DateTimePicker").disabledHours([
            10,9,8,7,6,5,4,3,2,1,00,24,23,17,18,19,20,21,22
          ]);
            console.log('is between');
          } else {
          $('#DatumZeit').data("DateTimePicker").disabledHours([
            10,9,8,7,6,5,4,3,2,1,00,24,23
          ]);
            console.log('is not between');
        }
      };

       if(document.getElementById('Restaurant').value != "Düsseldorf") {
          $('#DatumZeit').data("DateTimePicker").disabledHours([
            10,9,8,7,6,5,4,3,2,1,00,24,23
          ]);
       }
    }

Answer 2

实际上，我有一个适合自己需求的更好的版本，也可能对其他人有用。

function show(){
      if(document.getElementById('Restaurant').value == "Düsseldorf") {
        var myDate = new Date();
        var currenttime = moment(myDate); 
      var timestart = moment().startOf('day').hour(17);
        var timeend = moment().startOf('day').hour(23);

        if (currenttime.isBetween(timestart, timeend)) {
            $('#DatumZeit').data("DateTimePicker").date(moment().add(1, 'days')).disabledHours(
               [0,1,2,3,4,5,6,7,8,9,10,23,24]
            ) 
        } 
        else {
            $('#DatumZeit').data("DateTimePicker").date(moment(myDate)).disabledHours(
                [0,1,2,3,4,5,6,7,8,9,10,23,24]
            )
        }
      }   else {
      $('#DatumZeit').data("DateTimePicker").date(moment().add(2, 'hours')).enabledHours(
              [11, 12 ,13 ,14 ,15, 17,16, 18, 19, 20, 21, 22]
        )
      }
    }

更改禁用时间当其他选择选项更改时的当天时间

2 个答案: