年月日季度日历多选设置初始值demo
/*季度样式修改*/.datepicker-cell-block{display:block;width:100%;height:40px;line-height:40px;text-align:center;margin:2px 0;}.datepicker-cell-none{display:none;}
月份:年份:季度:
/*日期选择*/
//默认初始赋值数据
vardayData=['-05-01','-05-02','-05-03'];
$('#daySelect')
.attr('title',dayData.join())//设置title 当值太多显示不全时有用
.datepicker({
clearButton:true,
language:'zh',
multipleDates:true,//是否多选,Boolean | Number
multipleDatesSeparator:',',//多选间隔符号
onHide:function(inst, animationCompleted){
inst.$el.attr('title', inst.$el.val())
}
})
.data('datepicker')//.selectDate([new Date('-05-01'),new Date('-05-02'),new Date('-05-03')])
.selectDate(dayData.map(function(n){return newDate(n)}))/*月份选择*/
//默认初始赋值数据
varmonthData=['-01','-03','-05'];
$('#monthSelect')
.attr('title',monthData.join())
.datepicker({
clearButton:true,
language:'zh',
view:'months',
minView:'months',
dateFormat:'yyyy-mm',
multipleDates:12,
multipleDatesSeparator:',',
onHide:function(inst, animationCompleted){
inst.$el.attr('title', inst.$el.val())
}
})
.data('datepicker')
.selectDate(monthData.map(function(n){return newDate(n)}))/*年份选择*/
//默认初始赋值数据
varyearData=['','',''];
$('#yearSelect')
.attr('title',yearData.join())
.datepicker({
clearButton:true,
language:'zh',
view:'years',
minView:'years',
dateFormat:'yyyy',
multipleDates:5,
multipleDatesSeparator:',',
onHide:function(inst, animationCompleted){
inst.$el.attr('title', inst.$el.val())
}
})
.data('datepicker')
.selectDate(yearData.map(function(n){return newDate(n)}))/*季度计算*/
//默认初始赋值数据
varquarterData=['-第2季度','-第3季度','-第1季度'].join();varquarterFn= function(month){returnmonth< 4 ? 1:
month< 7 ? 2:
month< 10 ? 3:4;
}/*季度选择*/$('#quarterSelect')
.attr('title',quarterData)
.datepicker({
clearButton:true,
language:'zh',
view:'months',
minView:'months',
dateFormat:quarterData,
multipleDates:5,
multipleDatesSeparator:',',
onHide:function(inst, animationCompleted){
inst.$el.attr('title', inst.$el.val())
},
onRenderCell:function(date,cellType){if(cellType== 'month'){if((date.getMonth()+1)%3 == 0) {return{
html:'第'+quarterFn(date.getMonth()+ 1)+'季度',
classes:'datepicker-cell-block',
}
}else{return{
html:'第n季度',
classes:'datepicker-cell-none',
}
}
}
},
onSelect:function(formattedDate, date, inst){var_val= ''$.each(inst.selectedDates,function(k,v){
k===inst.selectedDates.length- 1 ?_val+=v.getFullYear()+ '-' + '第' +quarterFn(v.getMonth()+ 1)+ '季度':
_val+=v.getFullYear()+ '-' + '第' +quarterFn(v.getMonth()+ 1)+ '季度,';
})
inst.$el.val(_val)
}
})
.data('datepicker')
.selectDate(function(){var_quarterData=quarterData?quarterData
.replace(/第1季度/g,"3")
.replace(/第2季度/g,"6")
.replace(/第3季度/g,"9")
.replace(/第4季度/g,"12")
.split(',')
.map(function(n){return newDate(n)})
:'';return_quarterData
}())