jQuery Datepicker日期範圍填充內聯日曆

Question

我想獲取jQuery datepicker日期範圍字段來突出顯示所選日期內嵌日曆。到目前爲止，我已經獲得內聯日曆以獲取選定的日期，以填充2個不同的字段date1和date2。我只需要選定的日期範圍就可以突出顯示日曆中的選定日期。

我創建了這裏的jsfiddle（Jsfiddle Demo）

我已經嘗試了jQuery的交變磁場的方法，但沒有成功，任何幫助，將不勝感激！

這是我想要完成的圖片。

Answer 1

更新

隨着你的額外評論我更好地瞭解你正在嘗試做的。

Working JSFiddle。

小結：

• onSelect()是處理一個日期選擇的最佳方式，並且它是通過選定的日期爲一個字符串，所以我刪除您.on()處理程序和getDate()功能。

• 選擇它們時保存開始/結束日期;

• 當選擇開始/結束時，使用$('#datepicker').datepicker('refresh');刷新行內日期選擇器，以便調用beforeShowDay()，並且可以使用這些選定日期重新繪製日曆。它也會啓動內聯日期選擇器的初始化，但由於在該階段沒有選擇日期，它什麼都沒做。

• 簡化您在beforeShowDay()中爲開始和結束之間的天數（包括開始和結束）添加一個類的測試。我知道你可能需要比這更多（例如，可能突出顯示開始日期，當它是所有選定的），但這是最簡單的例子，演示一個工作的例子。

• 爲您的.dp-highlight類添加了基本樣式，必須添加更多特殊性以確保它覆蓋默認的日期選擇器樣式。

• 我也刪除了一些東西，以保持它的簡單：在在線日期選擇

  • 額外的投入，我知道你也許需要他們下一步但是這並不直接涉及這個問題;
  • 內嵌日期選擇器onSelect代碼，再次與此問題沒有直接關係;