從日期選擇器更新jquery timepicker插件

Question

我有兩個輸入字段，一個帶日期選擇器，另一個帶有時間選擇器（僅顯示時間滑塊，不帶日曆）。如果在datePicker中選擇了星期六，我想在時間選取器中顯示不同的時間跨度。 因此，HTML是這樣

<input id="datePicker" type="text" name="date"/> 
<input id="timePicker" type="text" name="time"/> 

的JavaScript看起來像這樣

$("#datePicker").datepicker({ 
    dateFormat : "dd/mm/yy", 
    onSelect: function(dateText, instance) { 
    var date = $.datepicker.parseDate("dd/mm/yy", dateText); 
    var isWeekend = !$.datepicker.noWeekends(date)[0]; 
    if (isWeekend) { 
     $("#timePicker").timepicker('options','hourMax', 15); 
    } 
    else { 
     $("#timePicker").timepicker('options','hourMax', 22); 
    } 
    } 
}); 
$("#timePicker").timepicker({ 
    hourMin : 8, 
    hourMax : 22, 
    stepMinute : 15, 
    timeOnly: true, 
    timeFormat : "HH:mm" 
}); 

與上面的代碼的問題是，它不是在timepicker更新最大小時，它顯示當我嘗試選擇一個新時間時，控制檯出現某種錯誤（錯誤不會影響時間跨度功能）： 解析日期字符串時出錯：位置2處出現意外的字面值 date string = 22:00 date format = dd/mm/yy 我是我們荷蘭國際集團

• 的jquery-1.8.3.min.js
• 的jquery-UI-1.9.2.custom.min.js
• 時間選擇器的版本1.2.1（http://trentrichardson.com/examples/timepicker/）

Answer 1

嘗試使用下面的代碼替換您發佈的代碼。 .timepicker構造函數查找hasDatepicker類，如果它找不到它，則重新繪製ui timepicker div。 JsFiddle

$("#datePicker").datepicker({ 
         dateFormat: "dd/mm/yy", 
         onSelect: function (dateText, instance) { 
          var date = $.datepicker.parseDate("dd/mm/yy", dateText); 
          var isWeekend = !$.datepicker.noWeekends(date)[0]; 
          alert(isWeekend); 
          if (isWeekend) { 
           $("#timePicker").removeClass("hasDatepicker"); 
           $("#timePicker").timepicker({ 
            hourMin: 8, 
            hourMax: 15, 
            stepMinute: 15, 
            timeOnly: true, 
            timeFormat: "HH:mm" 
           }); 
          } else { 
           $("#timePicker").removeClass("hasDatepicker"); 
           $("#timePicker").timepicker({ 
            hourMin: 8, 
            hourMax: 22, 
            stepMinute: 15, 
            timeOnly: true, 
            timeFormat: "HH:mm" 
           }); 
          } 
         } 
        });