Bootstrap Datetimepicker 季度筛选

仅限于筛选到季度。

原理
将原月筛选转为季度筛选。

实现
添加datetimepicker自定义语言:

$.fn.datetimepicker.dates['zh-CN-qtrs'] = {
    days: ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六", "星期日"],
    daysShort: ["周日", "周一", "周二", "周三", "周四", "周五", "周六", "周日"],
    daysMin:  ["日", "一", "二", "三", "四", "五", "六", "日"],
    months: ["Q1", "Q2", "Q3", "Q4", "", "", "", "", "", "", "", ""],
    monthsShort: ["一季度", "二季度", "三季度", "四季度", "", "", "", "", "", "", "", ""],
    clear: "清除",
    meridiem: ["上午", "下午"]
};

创建对象:

//初始化选中当前季度
var date = new Date();
date.setDate(1);
date.setMonth(Math.floor(date.getMonth() / 3));

$('input.input-date').each(function(idx, elem) {
    var that = $(this);
    that.datetimepicker({
        clearBtn:true,
        startView:3,
        minView:3,
        format:'yyyy/MM',
        language:'zh-CN-qtrs',
        initialDate: date
    });
    that.data('datetimepicker').picker.addClass('quarter');
}); 

添加样式:

.datetimepicker.quarter .month {
    width: 48%;
}
.datetimepicker.quarter .month:nth-child(n+5){
    display: none;
}