jQuery日程管理控件glDatePicker怎么用-創新互聯

這篇文章主要為大家展示了“jQuery日程管理控件glDatePicker怎么用”，內容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領大家一起研究并學習一下“jQuery日程管理控件glDatePicker怎么用”這篇文章吧。

創新互聯公司長期為上1000家客戶提供的網站建設服務，團隊從業經驗10年，關注不同地域、不同群體，并針對不同對象提供差異化的產品和服務；打造開放共贏平臺，與合作伙伴共同營造健康的互聯網生態環境。為茂名企業提供專業的網站設計制作、做網站，茂名網站改版等技術服務。擁有十余年豐富建站經驗和眾多成功案例,為您定制開發。

具體如下：

之前接觸過一款日程管理控件，叫 FullCalendar ，功能很強大，會列出每天的事項，可選擇編輯并且可以定制自己的日歷，然而，有時候，我們的網頁上只需要一個簡單的日歷，迷你但實用，有日程安排的日期高亮顯示，可跳轉日期，可選擇日期等等基本功能都應該具備，而這時 FullCalendar 就顯得太過龐大了，所以，就有了我對 glDatePicker 控件的學習。

先看效果：

jQuery日程管理控件glDatePicker怎么用

橘紅色表示當前選擇的日期，藍色表示今天日期，綠色表示特使日期，可以理解為有日程安排的日期，關于顏色名稱的描述可能不準確，就不要深究了。。。另外，后面兩張圖片可以看出是可以跳轉到指定日期的。

該控件有多個皮膚，只需要選擇對應的自己覺得好看的 css 文件即可，本例中為默認樣式。

該控件還可以設置哪些日期可選，哪些不可選，可以捆綁數據，可以監聽點擊事件和鼠標懸浮等等。

有一點需要注意的是，該控件為 datePicker 控件，一般需要通過其他頁面元素來觸發，也就是說該控件往往是跟在一個 input 之后的，但是現在需要的是日程管理，而不是日期選擇，所以，我們不需要有其他控件的出現，這里我用了一個很原始的辦法來解決的，就是寫一個空的 div ，設置其寬為200px ，高為0，并且設置該日歷始終顯示，這樣就可以基本解決問題了。

下面是控件的快速使用方法：

<link href="glDatePicker.default.css" rel="external nofollow" rel="stylesheet" type="text/css"/>
<script type='text/javascript' src="jquery-1.9.1.js"></script>
<script type='text/javascript' src="glDatePicker.min.js"></script>
<body>
 <div id="test"></div>
</body>

#test{
 width: 200px;
 height: 0;
}

$(function () {
　　$('#test').glDatePicker(
　　{
 　　showAlways: true,  //一直顯示，也可以點擊文本框觸發，當純粹datePicker使用
　　　　//dowNames: ['日', '一', '二', '三', '四', '五', '六'],
　　　　//monthNames: ['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月'], 漢化
 　　specialDates: [
  　　{
   　　date: new Date(2013, 9, 16),
   　　data: jsonObject //jsonObject數據，可以根據需要設計
  　　}
 　　],
 　　onClick: function(target, cell, date, data) {
  　　//TODO
 　　}
　　});
})

specialDates 就是日程安排的關鍵參數了，我們從數據庫中讀取數據，然后將這些數據按照預定的格式傳給控件就行了，值是一個列表，可以有多個日程。然后就是 onclick 事件方法的編寫了，可以彈窗啊，打開網頁啊等等，看自己需要了。

以上是“jQuery日程管理控件glDatePicker怎么用”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注創新互聯網站建設公司行業資訊頻道！

另外有需要云服務器可以了解下創新互聯建站www.2m8n56k.cn，海內外云服務器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務器、裸金屬服務器、高防服務器、香港服務器、美國服務器、虛擬主機、免備案服務器”等云主機租用服務以及企業上云的綜合解決方案，具有“安全穩定、簡單易用、服務可用性高、性價比高”等特點與優勢，專為企業上云打造定制，能夠滿足用戶豐富、多元化的應用場景需求。

標題名稱：jQuery日程管理控件glDatePicker怎么用-創新互聯
新聞來源：http://www.2m8n56k.cn/article22/dccjjc.html

成都網站建設公司_創新互聯，為您提供品牌網站建設、品牌網站設計、關鍵詞優化、Google、商城網站、虛擬主機

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：[email protected]。內容未經允許不得轉載，或轉載時需注明來源：創新互聯

猜你還喜歡下面的內容

中文字幕第五页-中文字幕第页-中文字幕韩国-中文字幕最新-国产尤物二区三区在线观看-国产尤物福利视频一区二区

jQuery日程管理控件glDatePicker怎么用-創新互聯