首先頁面是如下:
<form style="display: inline-block;vertical-align: middle;margin-top: 10px;">
<div style="display: inline-block;vertical-align: middle;width: 180px;" class="input-group date starttime1">
<input id="starttime" type="text" style="width: 180PX;" placeholder="起始時間" data-msg-required="請輸入起始時間" data-field="starttime" data-formatter="starttime" class="form-control ">
</div>
-
<div style="display: inline-block;vertical-align: middle;width: 180px;" class="input-group date endtime1">
<input id="endtime" type="text" data-field="endtime" style="width: 180PX;" placeholder="結束時間" data-msg-required="請輸入結束時間" data-formatter="endtime" class="form-control ">
</div>
<div style="display: inline-block;vertical-align: middle;" class="input-group">
<span style="width: 50px;" class="input-group-btn">
<button id="btn_Search" type="button" class="btn default">
<i class="fa fa-search"></i>查詢</button>
</span>
</div>
<div style="display: inline-block;vertical-align: middle;" class="input-group">
</div>
</form>
js代碼如下:
///開始時間
$("#starttime").datepicker({
autoclose: true,
language: "zh-CN",
// startDate: new Date(),
// endDate: $(this).data("end"),
clearBtn: true,
format: 'yyyy/mm/dd'
}).on('changeDate', function(ev) {
console.log(ev)
var starttime = $('[data-field="starttime"]').val();
console.log(starttime)
$('#endtime').datepicker('setStartDate', starttime);
});
$("#endtime").datepicker({
autoclose: true,
language: "zh-CN",
// startDate: new Date(),
endDate: new Date(),
clearBtn: true,
format: 'yyyy/mm/dd'
}).on('changeDate', function(ev) {
var starttime = $('[data-field="endtime"]').val();
$("#starttime").datepicker('setEndDate', starttime);
});