9 款樣式華麗的 jQuery 日期選擇和日曆控制元件

本文由碼農網 – 小峰原創，轉載請看清文末的轉載要求，歡迎參與我們的付費投稿計劃！

現在的網頁應用越來越豐富，我們在網頁中填寫日期和時間已經再也不用手動輸入了，而是使用各種各樣的日期時間選擇控制元件，大部分樣式華麗的日期選擇和日曆控制元件都是基於jQuery和HTML5的，比如今天要分享的這9款日期選擇控制元件，漂亮的UI外觀加上人性化的操作設計，大大提高了使用者體驗，讓我們一起來欣賞一下吧。

1、HTML5移動端外觀時尚的日期時間選擇控制元件

之前我們介紹過很多基於jQuery的日期時間選擇控制元件，比如這款基於Bootstrap和jQuery的日曆控制元件和日期選擇外掛。今天我們要分享一款基於HTML5的移動端日期時間選擇控制元件，它的外觀比較特別，適合移動裝置中使用，當然PC端用起來也非常不錯。

線上演示    /    原始碼下載

2、基於Bootstrap和jQuery的日曆控制元件和日期選擇外掛

這次我們要來分享一款漂亮而且實用的jQuery日曆控制元件和日期選擇外掛，而且這款日曆控制元件是基於Boostrap的，外觀還不錯。控制元件有兩種模式，一種是日曆模式，可以快速定位年份和月份，很方便。另一種是日期選擇模式，單擊輸入框即可彈出日期選擇控制元件，並且支援格式化日期。

線上演示    /    原始碼下載

3、jQuery/CSS3帶數字時鐘的圓盤時鐘

之前我們分享過很多基於jQuery和CSS3的時鐘外掛了，有數字時鐘，比如這款CSS3倒數計時時鐘動畫，也有一些圓盤時鐘，比如這款HTML5仿Apple Watch時鐘動畫和HTML5 SVG圓盤時鐘動畫 5種時鐘樣式。今天要介紹的這款時鐘外掛是數字時鐘和圓盤時鐘的混合，也就是在圓盤時鐘上嵌入了一個數字時鐘，更加美觀和實用。

線上演示    /    原始碼下載

4、jQuery萬年曆外掛 帶農曆老皇曆功能

這是一款基於jQuery的日曆外掛，這款日曆外掛和之前分享的日曆控制元件有很大差異，它是一本萬年曆，包含了農曆已經老皇曆的功能，是一個挑好日子的工具。同時日曆還可以檢視本年度的放假安排，功能非常強大。有興趣的朋友可以下載學習。

線上演示    /    原始碼下載

5、基於Bootstrap的日期選擇控制元件 可選擇多種日期格式

這次要介紹的日期選擇控制元件是基於Bootstrap風格的，可支援多種日期合適，並且外觀也非常清爽。

線上演示    /    原始碼下載

6、HTML5/CSS3帶日期區間的日期選擇外掛

今天我們來分享一款實用的HTML5/CSS3日期選擇外掛，這款日期選擇外掛的外觀還是挺清新簡易的，但是整體來說還是挺漂亮的。另外，該日期選擇外掛還有一個最大的特點，那就是可以自定義日期的區間，我們可以快速的制定區間範圍內的日期，非常方便。

線上演示    /    原始碼下載

7、jQuery多功能日曆外掛 帶事件記錄功能

之前我們也已經分享過不少jQuery日曆外掛，有些應用了CSS3的特性，外觀就特別漂亮。今天要分享的這款jQuery日曆外掛不僅有著絢麗的外觀，而且帶有日期事件記錄功能，點選日期即可展開事件記錄視窗，你可以設定事件的描述以及提醒的時間，是一款相對實用的jQuery日曆外掛。

線上演示    /    原始碼下載

8、jQuery UI 自定義樣式的日曆控制元件

今天要給大家帶來一款基於jQuery UI的日曆控制元件，這款日曆控制元件的樣式是通過自定義過的，顯得比較簡單輕便。日曆可以通過按鈕對年份和月份進行前翻和後翻，功能沒有那麼複雜，可能對一些簡單的部落格中可以使用這個日曆。

線上演示    /    原始碼下載

9、JavaScript日期選擇控制元件Kalendae

今天我們要來分享一款簡單而實用的JavaScript日期選擇控制元件，名叫Kalendae。它的外觀雖然很普通，但是功能很強大，不僅可以當日歷元件，也可以當做日期選擇控制元件。而且可以同時展示多個日期選擇控制元件，效果非常不錯。

線上演示    /    原始碼下載

以上就是9 款樣式華麗的 jQuery 日期選擇和日曆控制元件，希望會對你有所幫助。