JavaScript插件：快速選擇日期----jedate日歷插件

jedate是一款輕量級(jí)JS庫(kù)，可快速選擇日期?http://www.sucaijiayuan.com/Js/DateTime/1371.html

使用方法：

下載jedate ， 解壓后不要改變文件夾內(nèi)的目錄結(jié)構(gòu)，然后引入jedate.js文件，

<input id="datepicker" placeholder="請(qǐng)選擇時(shí)間" type="text" readonly/> var datepickerOptions = {dateCell:"#datepicker", //目標(biāo)元素。由于jedate.js封裝了一個(gè)輕量級(jí)的選擇器，因此dateCell還允許你傳入class、tag這種方式 '#id .class'format:"YYYY-MM-DD hh:mm:ss", //日期格式minDate:"1900-01-01 00:00:00", //最小日期maxDate:"2099-12-31 23:59:59", //最大日期isinitVal:false, //是否初始化時(shí)間isTime:true, //是否開啟時(shí)間選擇isClear:true, //是否顯示清空festival:false, //是否顯示節(jié)日zIndex:999, //彈出層的層級(jí)高度marks:null, //給日期做標(biāo)注choosefun:function(val) {}, //選中日期后的回調(diào)clearfun:function(val) {}, //清除日期后的回調(diào)okfun:function(val) {} //點(diǎn)擊確定后的回調(diào) }; jeDate(datepickerOptions);

注意一下幾點(diǎn)：

1、

dateCell:"#datepicker", //目標(biāo)元素。由于jedate.js封裝了一個(gè)輕量級(jí)的選擇器，因此dateCell還允許你傳入class、tag這種方式 '#id .class'

指定要填充日期的DOM

2、

format:"YYYY-MM-DD hh:mm:ss", //日期格式

返回日期格式，format不同會(huì)導(dǎo)致日歷界面的不同，例如：

"YYYY-MM"

"YYYY-MM-DD"

"YYYY-MM-DD hh:mm:ss" 同時(shí)設(shè)置isTime:true，開啟時(shí)間選擇

?

常見需求一般是選擇一個(gè)時(shí)間格式，因此設(shè)置一個(gè)函數(shù)，傳入三個(gè)主要參數(shù)：

/** *datePickerInit.js 小工具 使用前提條件-----引入jquery-1.11.3.js jedate.js *domId : 需要填充日期的DOM元素的id 比如是一個(gè)input的id *format: 需要填充日期的格式 例如 "YYYY-MM-DD hh:mm:ss" "YYYY-MM-DD hh:00:00" "YYYY-MM-DD hh:59:59" "YYYY年MM月DD日 hh時(shí)mm分ss秒" *isTime: 是否開啟時(shí)間選擇 **/ function datePickerInit(domId , format , isTime){var datePickerOptions = {dateCell:"#" + domId, //目標(biāo)元素。由于jedate.js封裝了一個(gè)輕量級(jí)的選擇器，因此dateCell還允許你傳入class、tag這種方式 '#id .class'format:format, //日期格式//minDate:"1900-01-01 00:00:00", //最小日期//maxDate:"2099-12-31 23:59:59", //最大日期isinitVal:false, //是否初始化時(shí)間isTime:isTime, //是否開啟時(shí)間選擇isClear:true, //是否顯示清空festival:false, //是否顯示節(jié)日zIndex:999, //彈出層的層級(jí)高度marks:null, //給日期做標(biāo)注choosefun:function(val) {}, //選中日期后的回調(diào)clearfun:function(val) {}, //清除日期后的回調(diào)okfun:function(val) {} //點(diǎn)擊確定后的回調(diào) };jeDate(datePickerOptions); }

即可方便的設(shè)置要填充的DOM元素

$(function(){datePickerInit("datepicker" , "YYYY-MM-DD hh:mm:ss" , true); });

總結(jié)

以上是生活随笔為你收集整理的jedate时间插件的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。