javascript月曆插件

javascript月曆插件

      最近在嘗試着寫javascript月曆插件，是以也到github上看國外人月曆源碼，或者國内人寫的好點的，也在研究點，雖然看到網上有一大把的月曆控件，但是沒有幾個是自己想要的，雖然效果是實作了，但是看他們的源碼，頭有點大，是以自己也在研究這方面的東西。周末用了2天來研究别人寫的代碼 自己也試着做做demo，今天正好基本功能完成了，是以趁着這個機會分享下：我們可以先來看看效果：JSFiddler位址如下：

<a href="http://jsfiddle.net/longen/6APH2/1/embedded/result/" target="_blank">demo連結請點選我</a>

基本的配置如下：

   targetCls

'',    輸入框dom節點 預設為空 必填項

 beginyear

1978,     開始年份

 endyear

 2050,    結束年份

 date

 new Date(),  預設日期

 type

 "yyyy-mm-dd" ,      日期格式(目前隻支援這一種)

separator

 '-' ,             日期連結符

wday

 0 ,             周的第一天

language

{

year:"年",

month:"月",

monthList:["1","2","3","4","5","6","7","8","9","10","11","12"],

weekList:["日","一","二","三","四","五","六"]} // 預設為中文

方法如下：

 1. show():  顯示月曆面闆。

 2. hide(): 隐藏月曆面闆。

 3. clear() 清除輸入框的日期。

 4. getValue() 擷取目前選中的日期。

 5. 提供callback回調。傳回一個參數(每當點選一項時候 傳回輸入框的值 即：月曆的值)。

所有的JS代碼如下：

代碼沒有什麼好解釋的 相應的有注釋，可以看看源碼 不難的。

HTML代碼可以這樣寫：

初始化代碼如下：

<a href="http://files.cnblogs.com/tugenhua0707/%E6%97%A5%E5%8E%86%E6%8E%A7%E4%BB%B6.rar">月曆控件demo下載下傳</a>