簡單好用的時間外掛laydate實現開始時間和結束時間的限制
阿新 • • 發佈:2019-02-18
我是在Laravel下使用的,具體按照你的情況,更改一下路徑就行
首先,引入js檔案,laydate的js檔案可以去官網下載
<script src="{{asset('lib/js/jquery-2.0.3.min.js')}}"></script>
<script src="{{asset('lib/js/laydate/laydate.dev.js')}}"></script>
然後,DOM加入開始和結束的ID
<label for="date">開始日期</label> <input type="text" id="start" name='start' class="form-control laydate-icon"/> <label for="date">結束日期</label> <input type="text" id="end" name='end' class="form-control laydate-icon"/>
接著,讓LAYDATE功能實現
$(function(){ var start = { elem: '#start', //選擇ID為START的input format: 'YYYY/MM/DD hh:mm:ss', //自動生成的時間格式 min: laydate.now(), //設定最小日期為當前日期 max: '2099-06-16 23:59:59', //最大日期 istime: true, //必須填入時間 istoday: false, //是否是當天 start: laydate.now(0,"YYYY/MM/DD hh:mm:ss"), //設定開始時間為當前時間 choose: function(datas){ end.min = datas; //開始日選好後,重置結束日的最小日期 end.start = datas //將結束日的初始值設定為開始日 } }; var end = { elem: '#end', format: 'YYYY/MM/DD hh:mm:ss', min: laydate.now(), max: '2099-06-16 23:59:59', istime: true, istoday: false, start: laydate.now(0,"YYYY/MM/DD hh:mm:ss"), choose: function(datas){ start.max = datas; //結束日選好後,重置開始日的最大日期 } }; laydate(start); laydate(end); })