1. 程式人生 > >layui中時間選擇器的使用

layui中時間選擇器的使用

1、HTML頁面引入layui.js檔案

<script src="../../plugins/layui/layui.js"></script>

使用選擇器的部分程式碼如下:

 <div class="layui-inline layui-col-xs10 layui-col-sm3 layui-col-md3">             <label class="layui-form-label">建立日期</label>             <div class="layui-input-block">                 <input type="text" name="search[createDate]" id="createDate" autocomplete="off" class="layui-input">             </div>                </div>

2、頁面對應的js檔案中,標紅的為時間選擇顯示出來需要的程式碼

var active; layui.use(['table','laydate'], function(){     var token=getToken();     var $ = layui.$     var table = layui.table;     var laydate= layui.laydate;    .....................

    .....................

    laydate.render({         //日期範圍選擇           elem: '#createDate'          ,type: 'datetime'          ,range: '~'      //如果設定 true,將預設採用 “ - ” 分割或 range: '~' 來自定義分割字元         });

})