簡潔JS 日歷控件 支持日期和月份選擇(轉)


以下這個JS日歷控件是我的閑暇之余自己編寫的,所有的代碼全部在IE7/IE8/Firefox下面測試通過,

而且可以解決被iframe層遮蓋的問題。現在只提供兩種風格(簡潔版和古典版)和兩種語言(英文和中文)。支持自定義日期格式,設定時間范圍。

默認為古典版,英文,下面來看簡單的縮略圖。

首先是簡潔版:

簡潔JS 日歷控件 支持日期和月份選擇 - 雪舞殘鴻 - 你若安好,便是晴天!日期選擇器簡潔JS 日歷控件 支持日期和月份選擇 - 雪舞殘鴻 - 你若安好,便是晴天!月份選擇器

古典版:

簡潔JS 日歷控件 支持日期和月份選擇 - 雪舞殘鴻 - 你若安好,便是晴天!日期選擇器簡潔JS 日歷控件 支持日期和月份選擇 - 雪舞殘鴻 - 你若安好,便是晴天!日期選擇器中文語言簡潔JS 日歷控件 支持日期和月份選擇 - 雪舞殘鴻 - 你若安好,便是晴天!月份選擇器

下面是使用方法:

在要使用這個控件的頁面上引入這個JS

<script type="text/javascript" src="javascript/DatePicker.js"></script>

使用月份選擇器,默認時間格式為yyyy-MM

<input id="begintime" type="text" onclick="setmonth(this)" readonly="readonly" />

使用日期選擇器,默認時間格式為yyyy-MM-dd
<input id="endtime" type="text" onfocus="setday(this)" readonly="readonly" />

使用日期選擇器,一共提供五個參數,其中第一個參數是Object類型,指需要填入日期的元素對象;第二個參數是時間的格式,默認為yyyy-MM-dd;第三、四個參數分別為開始時間和結束時間;第五個參數是語言種類,這個1表示中文,0為英文(默認采用英文)
<input id="endtime" type="text" onfocus="setday(this,‘yyyy-MM-dd’,'2010-01-01','2010-12-30',1)" readonly="readonly" />

風格默認使用古典版,如果需要使用簡潔版,則進入代碼中

簡潔JS 日歷控件 支持日期和月份選擇 - 雪舞殘鴻 - 你若安好,便是晴天!
將上述代碼中的上部分代碼(30行-56行)注釋,在把他換成下面部分的代碼(57行-83行)。則風格就可以改為簡潔版了。

說了這么多,下面附上這個日歷控件的JS文件:

http://files.cnblogs.com/coraldane/DatePicker.js


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM