1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > 多选月份的日期选择器_日期多选 月份多选 年份多选 季度多选 日历区间选择...

多选月份的日期选择器_日期多选 月份多选 年份多选 季度多选 日历区间选择...

时间:2023-03-12 04:17:01

相关推荐

多选月份的日期选择器_日期多选 月份多选 年份多选 季度多选 日历区间选择...

年月日季度日历多选设置初始值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

}())

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。