jquery 時間選擇器和 ajax

Question

我正在嘗試將時間值傳遞給 timepicker。 我使用ajax從數據庫中獲取時間。 當我將數據庫中的值傳遞給參數 disableTimeRanges 時，

$(function() {
        $("#id_time_visit").timepicker({
             timeFormat: 'H:i',
             minTime: '8', 
             maxTime: '19',
             step: 60,
             disableTimeRanges: []
        });
    });
    $('.pole').change('input', function() {
     var datetime = $(this).val();//I get the value from the form field
       $.ajax({
       url: '/your-url/',
       type: 'get', 
       data: {'datetime': datetime},
        success: function(e){
             console.log(e)
             var time=e;
             $("#id_time_visit").timepicker({
                 timeFormat: 'H:i',
                 minTime: '8', 
                 maxTime: '19',
                 step: 60,
                 disableTimeRanges: time
             });
        },
        error: function(e){
             console.log(e);
        }
    })

時間變得不可用，但是當我選擇具有不同時間的另一天時，只有當我重新加載頁面時，當天的時間才會變得不可訪問。 如何在不重新啟動的情況下更改日期時更新時間

Answer 1

在這種情況下，要更新時間選擇器，我們只更新特定的目標選項。 此代碼中的數組旨在模擬您的 Ajax 調用。

 let disRange = [ [ "11.00 am", "16.00 am" ] ]; $(function() { $("#id_time_visit").timepicker({ timeFormat: 'H:i', minTime: '8', maxTime: '19', step: 60, disableTimeRanges: [] }); $('#id_time_visit').timepicker('option', 'disableTimeRanges', disRange); });

 <link href="https://cdnjs.cloudflare.com/ajax/libs/jquery-timepicker/1.10.0/jquery.timepicker.min.css" rel="stylesheet"/> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-timepicker/1.10.0/jquery.timepicker.min.js"></script> <input id="id_time_visit" type="text">

PS：如果它不起作用，請分享您在（日歷）天輸入上使用事件的其他代碼部分...