1

我正在使用 TempusDominus Bootstrap4 日期时间选择器。我有两个 datetimepicker从 date和to date。我希望当用户从第一个 DateTime 选择器中选择日期然后禁用第二个 datetimepicker 中的日期。

我正在关注这个链接并想要同样的东西，但它对我不起作用。我不确定问题出在哪里。

<div class="col-md-3">
    <div class="input-group date" id="startTime" data-target-input="nearest">
       <input type="text" name="startTime" id="startDate" class="form-control datetimepicker-input" data-target="#startTime" value="">
       <div class="input-group-append" data-target="#startTime" data-toggle="datetimepicker">
        <div class="input-group-text"><i class="fa fa-calendar" aria-hidden="true"></i></div>
       </div>
    </div>
</div>
<div class="col-md-3">
<div class="input-group date" id="endTime" data-target-input="nearest">
    <input type="text" name="endTime" id="endDate" class="form-control datetimepicker-input" data-target="#endTime" value="">
     <div class="input-group-append" data-target="#endTime" data-toggle="datetimepicker">
       <div class="input-group-text"><i class="fa fa-calendar" aria-hidden="true"></i></div>
     </div>
   </div>
</div>

Javascript代码

<script>
     $('#startTime').datetimepicker({  
        format: 'DD.MM.YYYY',
        minDate:new Date()
     });
         
     $('#endTime').datetimepicker({ 
       format: 'DD.MM.YYYY',
       minDate:new Date($('#startDate').val())
     });

     $('#startDate').on("blur",function(){
       $('#endTime').data("DateTimePicker").destroy();
       $('#endTime').datetimepicker({ 
         format: 'DD.MM.YYYY',
         minDate:new Date($('#startDate').val())
       });
    });
</script>
4

0 回答 0