EasyUI中Calendar日历的简单使用
生活随笔
收集整理的這篇文章主要介紹了
EasyUI中Calendar日历的简单使用
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
場景
效果
屬性
| width | number | 日歷（calendar）組件的寬度。 | 180 |
| height | number | 日歷（calendar）組件的高度。 | 180 |
| fit | boolean | 當(dāng)設(shè)置為 true 時(shí)，則設(shè)置日歷的尺寸以適應(yīng)它的父容器。 | false |
| border | boolean | 定義是否顯示邊框。 | true |
| firstDay | number | 定義每星期的第一天。星期日（Sunday）是 0，星期一（Monday）是 1，... | 0 |
| weeks | array | 顯示星期的列表。 | ['S','M','T','W','T','F','S'] |
| months | array | 顯示月份的列表。 | ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] |
| year | number | 日歷的年。下面的實(shí)例演示如何使用指定的年和月來創(chuàng)建一個(gè)日歷。 | 當(dāng)前年份（4 位） |
| month | number | 日歷的月。 | 當(dāng)前月份（從 1 開始） |
| current | Date | 當(dāng)前的日期。 | 當(dāng)前日期 |
事件
| onSelect | date | 當(dāng)用戶選擇一個(gè)日期時(shí)觸發(fā)。 代碼實(shí)例： |
方法
| options | none | 返回選項(xiàng)（options）對(duì)象。 |
| resize | none | 調(diào)整日歷的尺寸。 |
| moveTo | date | 移動(dòng)日歷到一個(gè)指定的日期。 代碼實(shí)例： |
?
實(shí)現(xiàn)
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title><link rel="stylesheet" type="text/css" href="/easyui/themes/icon.css"><link rel="stylesheet" type="text/css" href="/easyui/themes/default/easyui.css"><script type="text/javascript" src="/easyui/jquery.min.js"></script><script type="text/javascript" src="/easyui/jquery.easyui.min.js"></script> </head> <body> <div id="cc" class="easyui-calendar" style="width:180px;height:180px;"></div> <div id="cc1"></div> <script type="text/javascript">$('#cc1').calendar({onSelect: function(date){alert(date.getFullYear()+":"+(date.getMonth()+1)+":"+date.getDate());}}); </script> </body> </html>?
總結(jié)
以上是生活随笔為你收集整理的EasyUI中Calendar日历的简单使用的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： EasyUI中filebox文件选择框的
- 下一篇： EasyUI中Datebox日期框的简单