layui前段框架日期控件使用方法詳解
更新時間:2017年05月19日 10:02:12 作者:廣信_劉東君
這篇文章主要為大家詳細介紹了layui前段框架日期控件使用方法,具有一定的參考價值,感興趣的小伙伴們可以參考一下
本文實例為大家分享了layui-日期控件的實現(xiàn)代碼,供大家參考,具體內(nèi)容如下
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>日期</title> <link rel="stylesheet" href="layui/css/layui.css"> </head> <body> <blockquote class="layui-elem-quote">目前Layui中的日期組件還是layDate 1.1的改良版,它后續(xù)將會進行一次重寫。</blockquote> <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;"> <legend>順便列舉幾個常用例子</legend> </fieldset> <div class="layui-form-pane" style="margin-top: 15px;"> <div class="layui-form-item"> <label class="layui-form-label">范圍選擇</label> <div class="layui-input-inline"> <input class="layui-input" placeholder="開始日" id="LAY_demorange_s"> </div> <div class="layui-input-inline"> <input class="layui-input" placeholder="截止日" id="LAY_demorange_e"> </div> </div> </div> <script src="layui/layui.js"></script> <script> layui.use('laydate', function(){ var laydate = layui.laydate; var start = { min: laydate.now() ,max: '2099-06-16 23:59:59' ,istoday: false ,choose: function(datas){ end.min = datas; //開始日選好后,重置結(jié)束日的最小日期 end.start = datas //將結(jié)束日的初始值設(shè)定為開始日 } }; var end = { min: laydate.now() ,max: '2099-06-16 23:59:59' ,istoday: false ,choose: function(datas){ start.max = datas; //結(jié)束日選好后,重置開始日的最大日期 } }; document.getElementById('LAY_demorange_s').onclick = function(){ start.elem = this; laydate(start); } document.getElementById('LAY_demorange_e').onclick = function(){ end.elem = this laydate(end); } }); </script> </body> </html>
效果圖:
官網(wǎng)日期控件
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
Jquery幻燈片特效代碼分享 打開頁面隨機選擇切換方式(3)
jQuery是一個非常優(yōu)秀的 JavaScript 框架,使用簡單靈活,一個漂亮的幻燈片更能吸引訪客的注意力。本文實例講述了jQuery實現(xiàn)時尚漂亮的幻燈片特效,基本能滿足你在網(wǎng)頁上使用幻燈片(焦點圖)效果。分享給大家供大家參考。具體如下:2015-08-08jQuery EasyUI API 中文文檔 - ValidateBox驗證框
jQuery EasyUI API 中文文檔 - ValidateBox驗證框,使用jQuery EasyUI的朋友可以參考下。2011-10-10jQuery多媒體插件jQuery Media Plugin使用詳解
這篇文章主要介紹了jQuery多媒體插件jQuery Media Plugin使用詳解,需要的朋友可以參考下2014-12-12使用element-ui的el-menu導航選中后刷新頁面保持當前選中狀態(tài)
這篇文章主要介紹了使用element-ui的el-menu導航選中后刷新頁面保持當前選中狀態(tài),本文通過實例代碼給大家介紹的非常詳細,具有一定的參考借鑒價值,需要的朋友可以參考下2019-07-07