laydate.js日期時(shí)間選擇插件
日期時(shí)間選擇插件laydate.js:
效果圖:
1. 引入JS。 官網(wǎng):http://laydate.layui.com
<script type="text/javascript" src="js/laydate.js"></script>
2. 根據(jù)需要做相應(yīng)的配置。詳情參看官網(wǎng)。
<script> laydate({ elem: '#seldate', //目標(biāo)元素。由于laydate.js封裝了一個(gè)輕量級(jí)的選擇器引擎,因此elem還允許你傳入class、tag但必須按照這種方式 '#id .class' event: 'focus', //響應(yīng)事件。如果沒有傳入event,則按照默認(rèn)的click format: 'YYYY/MM/DD hh:mm:ss', // 分隔符可以任意定義,該例子表示只顯示年月 festival: true, //顯示節(jié)日 istime: true, //顯示時(shí)間選項(xiàng) choose: function(datas){ //選擇日期完畢的回調(diào) alert('得到:'+datas); } }); </script>
實(shí)例源碼:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- <link href="favicon.ico" rel="shortcut icon" type="image/x-icon" /> <link href="favicon.ico" rel="Bookmark" type="image/x-icon" /> --> <meta name="Generator" content="EditPlus®"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <title>layDate日期時(shí)間選擇插件</title> <link href="" rel="stylesheet" /> <script type="text/javascript" src="js/laydate.js"></script> </head> <body> <form method="post" action=""> Way1, 請(qǐng)選擇日期:<input type="text" name="date" onclick="laydate()" /> <hr /> Way2, <input type="text" name="date" id='seldate' class="laydate-icon" /><hr /> <script> laydate({ elem: '#seldate', //目標(biāo)元素。由于laydate.js封裝了一個(gè)輕量級(jí)的選擇器引擎,因此elem還允許你傳入class、tag但必須按照這種方式 '#id .class' event: 'focus', //響應(yīng)事件。如果沒有傳入event,則按照默認(rèn)的click format: 'YYYY/MM/DD hh:mm:ss', // 分隔符可以任意定義,該例子表示只顯示年月 festival: true, //顯示節(jié)日 istime: true, //顯示時(shí)間選項(xiàng) choose: function(datas){ //選擇日期完畢的回調(diào) alert('得到:'+datas); } }); </script> Way3, <input id="seldate1"> <span class="laydate-icon" onclick="laydate({elem:'#seldate1'});"></span> </form> </body> </html>
Find more here:http://laydate.layui.com/
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
javascript實(shí)現(xiàn)一個(gè)網(wǎng)頁加載進(jìn)度loading
本篇文章主要介紹了javascript實(shí)現(xiàn)一個(gè)頁面加載進(jìn)度loading的具體步驟以及示例代碼,具有一定的參考價(jià)值,下面跟著小編一起來看下吧2017-01-01JavaScript中的"=、==、==="區(qū)別講解
今天小編就為大家分享一篇關(guān)于JavaScript中的"=、==、==="區(qū)別講解,小編覺得內(nèi)容挺不錯(cuò)的,現(xiàn)在分享給大家,具有很好的參考價(jià)值,需要的朋友一起跟隨小編來看看吧2019-01-01JS使用replace()方法和正則表達(dá)式進(jìn)行字符串的搜索與替換實(shí)例
這篇文章主要介紹了JS使用replace()方法和正則表達(dá)式進(jìn)行字符串的搜索與替換實(shí)例,需要的朋友可以參考下2014-04-04微信小程序使用scroll-view標(biāo)簽實(shí)現(xiàn)自動(dòng)滑動(dòng)到底部功能的實(shí)例代碼
本文通過實(shí)例代碼給大家介紹了微信小程序使用scroll-view標(biāo)簽實(shí)現(xiàn)自動(dòng)滑動(dòng)到底部功能,代碼簡(jiǎn)單易懂,非常不錯(cuò),具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2018-11-11javascript 密碼強(qiáng)度驗(yàn)證規(guī)則、打分、驗(yàn)證(給出前端代碼,后端代碼可根據(jù)強(qiáng)度規(guī)則翻譯)
密碼強(qiáng)度是一個(gè)很普遍的功能,比較簡(jiǎn)單,主要是怎么制定這個(gè)強(qiáng)度規(guī)則。2010-05-05js實(shí)現(xiàn)鼠標(biāo)劃過給div加透明度的方法
這篇文章主要介紹了js實(shí)現(xiàn)鼠標(biāo)劃過給div加透明度的方法,涉及javascript動(dòng)態(tài)操作頁面元素屬性的相關(guān)技巧,該方法可兼容火狐與IE瀏覽器,需要的朋友可以參考下2015-05-05