bootstrap datetimepicker日期插件使用方法

1.github下載資源包  http://www.bootcss.com/p/bootstrap-datetimepicker/

2.引入bootstrap-datetimepicker.min.css和bootstrap-datetimepicker.min.js 

3.中文包  bootstrap-datetimepicker.zh-CN.js

　　html

　　　　<input  name="entryDate" placeholder="請選擇入職日期" id="blrz-entry-date-start" type="text" >

　　js　　

　　　　$("#blrz-entry-date-start").datetimepicker({//選擇年月日
　　　　　　format: 'yyyy-mm-dd',
　　　　　　language: 'zh-CN',
　　　　　　weekStart: 1,
　　　　　　todayBtn: 1,//顯示‘今日’按鈕
　　　　　　autoclose: 1,
　　　　　　todayHighlight: 1,
　　　　　　startView: 2,
　　　　　　minView: 2,  //Number, String. 默認值：0, 'hour'，日期時間選擇器所能夠提供的最精確的時間選擇視圖。

　　　　　　clearBtn:true,//清除按鈕

　　　　　　forceParse: 0
　　　　});

　　　　//選擇年月的       startView: 3,   minView: 3, format: 'yyyymm',

　　　　//選擇年的       startView: 4,   minView: 4, format: 'yyyy',

　　補： 可將input設設置為不可用狀態　

　　　　$('#blrz-entry-date-start').focus(function(){
　　　　　　$(this).blur();//不可輸入狀態
　　　　})

　　　　**無論format如何定義，都可取到時間格式

　　　　$('#add-dateTime').datetimepicker('getDate').getTime()

　　/*************************************************************************************************************/

//通過入職日期改變勞動合同截止日期(后者在前者的基礎上加2年)

　　<input  name="entryDate" placeholder="入職日期" id="blrz-entry-date-start" type="text" >

　　<input  name="entryDate" placeholder="合同截止日期" id="blrz-entry-date-end" type="text" >

$("#blrz-entry-date-start").on('change',function(){
　　var thisEntryDate = $("#blrz-entry-date-start").val();
　　if(thisEntryDate != ''){
　　　　thisEntryDate = thisEntryDate.replace(/-/g,"/");
　　　　var normalDate = new Date(thisEntryDate);//轉為標准時間格式
　　　　normalDate.setFullYear(normalDate.getFullYear()+2);//將年份加兩年
　　　　var formatDateTime = function (date) {
　　　　　　var y = date.getFullYear();
　　　　　　var m = date.getMonth() + 1;
　　　　　　m = m < 10 ? '0' + m : m;
　　　　　　var d = date.getDate();
　　　　　　d = d < 10 ? ('0' + d) : d;
　　　　　　return y + '-' + m + '-' + d;
　　　　};
　　　　var forContract_deadline = formatDateTime(normalDate)
　　　　$("#blrz-entry-date-end").val(forContract_deadline)
　　}
})
//通過入職日期改變勞動合同截止日期end

/*************************************************************************************************************/

初始化日期為當前時間

先提供幾個公共函數，供格式化日期使用

Date.prototype.format = function(fmt) {
　　var o = {
　　　　"M+" : this.getMonth()+1, //月份
　　　　"d+" : this.getDate(), //日
　　　　"h+" : this.getHours(), //小時
　　　　"m+" : this.getMinutes(), //分
　　　　"s+" : this.getSeconds(), //秒
　　　　"q+" : Math.floor((this.getMonth()+3)/3), //季度
　　　　"S" : this.getMilliseconds() //毫秒
　　};
　　if(/(y+)/.test(fmt)) {
　　　　fmt=fmt.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length));
　　}
　　for(var k in o) {
　　　　 if(new RegExp("("+ k +")").test(fmt)){
　　　　　　fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));
　　　　}
　　}
return fmt;
}

function getDate(strDate){
　　if(strDate && strDate!=""){
　　　　var date = eval('new Date(' + strDate.replace(/\d+(?=-[^-]+$)/, function (a) { return parseInt(a, 10) - 1; }).match(/\d+/g) + ')');
　　　　return date;
　　}
return undefined;
}

function formatDate(date, fmt){
　　var format = fmt || "yyyy-MM-dd hh:mm:ss";
　　if(date instanceof Date){
　　　　return date.format(format);
　　}else if(typeof date == 'string'){
　　　　var d = getDate(date);
　　　　if(d){
　　　　　　return d.format(format);
　　　　}
　　       return '';
　　}else{
　　　　return date;
　　}
}

$("#blrz-entry-date-start").val('2017-10-01')；

此時雖然功能實現了 但你會發現

　　時間果斷回到1899年

　　解決辦法：

　　var thisNow = new Date();
　　thisNow.setMonth(thisNow.getMonth()-1);

 

　　$('#blrz-entry-date-start').datetimepicker('update',formatDate(thisNow,'yyyy-MM-dd'));

　　然后呢，請看效果

　　

　　大功告成！！