$('#datepicker').datetimepicker({
//在輸入框顯示的格式
format: 'yyyy-mm-dd',
autoclose: true,
//彈出選擇器時(shí)默認(rèn)選擇的日期,不是文本框的值
initialDate:new Date(new Date()-24*60*60*1000),
//endDate后的日期都是灰色,不可選
endDate: new Date(new Date()-24*60*60*1000),
minView: 2,//表示最小單位是日,其他值有1,2,3,4
//minuteStep:1,//選擇分鐘時(shí)顯示的時(shí)間間隔,此處設(shè)置為1分鐘
language: 'zh-CN'
}).on('changeDate', function (e) {
//日期變動(dòng)監(jiān)聽(tīng)
//主動(dòng)通知bootstrapValidator才可觸發(fā)驗(yàn)證
$('#formSearch').bootstrapValidator('revalidateField', 'date');
});
<input readonly type="text" class="form-control" id="datepicker" name="date" format="yyyy-mm-dd "/>
daterangepicker
準(zhǔn)備工作
<link href="${ctx}/styles/bootstrap/css/daterangepicker.css")" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="${ctx}/js/bootstrap/moment.js"></script>
<script type="text/javascript" src="${ctx}/js/bootstrap/daterangepicker.js"></script>
js代碼
//初始化
var oDatepicker = DatepickerInit();
oDatepicker.init();
//定義類
function DatepickerInit(){
var oDatepickerInit = new Object();
var dateYest=new Date(new Date()-24*60*60*1000);
oDatepickerInit.init=function(){
$('#datetimepicker').daterangepicker({
'autoUpdateInput':true,
'showWeekNumbers': true,
//開(kāi)始時(shí)間
'startDate': dateYest,
//結(jié)束時(shí)間
'endDate': dateYest,
//"autoApply": true,
"ranges": {
'今天': [moment(), moment()],
'昨天': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
'過(guò)去七天': [moment().subtract(6, 'days'), moment()],
'過(guò)去三十天': [moment().subtract(29, 'days'), moment()],
'本周': [moment().startOf('week'), moment().endOf('week')],
'本月': [moment().startOf('month'), moment().endOf('month')],
//'上個(gè)月': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
},
locale: {
format: 'YYYY-MM-DD',
applyLabel: '確定',
cancelLabel: '取消',
fromLabel: '起始時(shí)間',
separator : ' 至 ',
toLabel: '結(jié)束時(shí)間',
customRangeLabel: '自定義',
daysOfWeek: ['日', '一', '二', '三', '四', '五', '六'],
monthNames: ['一月', '二月', '三月', '四月', '五月', '六月','七月', '八月', '九月', '十月', '十一月', '十二月'],
firstDay: 1
},
}, function(start, end, label) {
//監(jiān)聽(tīng)日期選擇器的選擇事件,對(duì)于初始化startDate、endDate無(wú)效
//start,end是moment類型
oDatepicker.startDate = start.format('YYYY-MM-DD');
oDatepicker.endDate= end.format('YYYY-MM-DD');
});
}
//需要手動(dòng)賦值
oDatepickerInit.startDate = dateYest.format('yyyy-MM-dd');
oDatepickerInit.endDate= dateYest.format('yyyy-MM-dd');
return oDatepickerInit;
}
html:
<input type="text" class="form-control" id="datetimepicker" format="yyyy-mm-dd ">