今天為一個項目中增加一些功能,用到了DatetimePicker的不同視圖:小時/日/月/年,寫法記錄如下,主要是設定 startView和minView兩個屬性:
//小時視圖
$('#dtpDate1').datetimepicker({
language:'zh-CN',
format:'yyyy-mm-dd hh:00',
weekStart: 1,
todayBtn: 1,
autoclose: 1,
todayHighlight: 1,
startView: 1, //小時視圖
minView: 1,
})
//日視圖
$('#dtpDate1').datetimepicker({
language:'zh-CN',
format:'yyyy-mm-dd',
weekStart: 1,
todayBtn: 1,
autoclose: 1,
todayHighlight: 1,
startView: 2, //日視圖
minView: 2,
})
//月視圖
$('#dtpDate1').datetimepicker({
language:'zh-CN',
format:'yyyy-mm',
todayBtn: 1,
autoclose: 1,
todayHighlight: 1,
startView: 3, //月視圖
minView: 3,
})
//年視圖
$('#dtpDate1').datetimepicker({
language:'zh-CN',
format:'yyyy',
weekStart: 1,
todayBtn: 1,
autoclose: 1,
todayHighlight: 1,
startView: 4, //年視圖
minView: 4,
})
效果: