资源库:https://pan.baidu.com/s/1N7WhR_NmGFsxKilXgJfCUg
<!-- 日期Daterange picker -->
<link href="/hqt/static/plugin/datetimepicker/bootstrap-datetimepicker.css" rel="stylesheet" type="text/css" />
<input class="form-control" type="text" value="" id="starttime" readonly>
<input class="form-control" type="text" value="" id="expirationDate" readonly>
<!-- 日期控件 -->
<script src="/hqt/static/plugin/datetimepicker/bootstrap-datetimepicker.js"></script>
<script src='/hqt/static/plugin/datetimepicker/locales/bootstrap-datetimepicker.zh-CN.js'></script>
<script>
$('#starttime').datetimepicker({
format : 'yyyy-mm-dd hh:ii',
language : 'zh-CN',
weekStart : 1,
todayBtn : 1,
autoclose : 1,
todayHighlight : 1,
startView : 2,//日期时间选择器打开之后首先显示的视图。 可接受的值://0 分钟视图;1小时
minView : 0, //日期时间选择器所能够提供的最精确的时间选择视图
minuteStep:1,//分钟
formatViewType : 'time'
}).on('hide', function(event) {
event.preventDefault();
event.stopPropagation();
var startTime = event.date;
$("#expirationDate").datetimepicker('setStartDate',startTime);
$("#expirationDate").val("");
});
$('#expirationDate').datetimepicker({
format : 'yyyy-mm-dd hh:ii',
language : 'zh-CN',
weekStart : 1,
todayBtn : 1,
autoclose : 1,
todayHighlight : 1,
startView : 2,//日期时间选择器打开之后首先显示的视图。 可接受的值://0 分钟视图;1小时
minView : 0, //日期时间选择器所能够提供的最精确的时间选择视图
minuteStep:1,//分钟
formatViewType : 'time'
}).on('hide', function(event) {
event.preventDefault();
event.stopPropagation();
var endTime = event.date;
$("#startDate").datetimepicker('setEndDate',endTime);
});
</script>