1. 程式人生 > >jquery時間選擇控制元件-laydate

jquery時間選擇控制元件-laydate

檢視演示website立刻下載錯誤提交 填加用法
layDate致力於成為全球最用心的web日期支撐,為國內外所有從事web應用開發的同仁提供力所能及的動力。她基於原生JavaScript精心雕琢,相容了包括IE6在內的所有主流瀏覽器。她具備優雅的內部程式碼,良好的效能體驗,和完善的面板體系,並且完全開源,你可以任意獲取開發版原始碼,一掃某些傳統日期控制元件的封閉與狹隘。layDate本著資源共享的開發者精神和對網頁日曆互動無窮的追求,延續了layui一貫的簡單與易用。她遵循LGPL協議,您可以免費將她用於任何個人專案
引數解釋:
istime : 判斷是否時間,如果true則判斷時間合法性,亂輸入的將提示然後清空
format :日期格式,hh:mm:ss則表示需要具體時間,另外,需要先選擇時間,再選擇日期,因為點選日期後將被認為是選擇完畢。
festival :true  是否顯示節日。注意:只顯示國際節日
istoday : false  是否顯示今天的按鈕,預設為顯示
min :'2015-01-01 00:00:00'    選擇最小日期
max :'2015-02-02 12:00:00'    選擇最大日期
最小日期與最大日期選擇後的不足之處:
如上,現在是2014年,日期段被定義為上面區間的時候,年份能自動定位到2015年,月份無法自動定位到01月
2如上,最大日期是12點,但是 我選擇2015-02-02 06 之後分和秒無法選擇了


min: laydate.now(-1), //-1代表昨天,-2代表前天,以此類推
max: laydate.now(+1) //+1代表明天,+2代表後天,以此類推
<input onclick="laydate()">    //最簡單的呼叫方式
<input onclick="laydate({istime: true, format: 'YYYY-MM-DD hh:mm:ss'})">    //附帶條件的呼叫方式
<div onclick="laydate()"></div>        //您其實還可以設定任何html元素作為目標物件
外部呼叫JS方法:


<input type="text" id="#hello" />
laydate({
 
    elem: '#hello', //目標元素。由於laydate.js封裝了一個輕量級的選擇器引擎,因此elem還允許你傳入class、tag但必須按照這種方式 '#id .class'
 
    event: 'focus' //響應事件。如果沒有傳入event,則按照預設的click
 
});
<input type="text" id="#hello" class="laydate-icon"/>    //新增class屬性,則在輸入框中帶日期icon,並且修飾input框
圖示觸發日期 :


<input id="hello1">

<span class="laydate-icon" onclick="laydate({elem: '#hello1'});"></span>