再次给力发布，首款全中文习惯，支持鼠标滑动多选的多月（可以显示N个月）的日历控件，界面仿Twitter风格，多语言支持，Ctrl/Shift多选支持，日期范围限制支持，自定义事件支持

号外：kitjs官方讨论QQ群建立了，QQ群号 88093625，欢迎大家加入，讨论前端相关话题 

 

 

地址：http://xueduany.github.com/KitJs/KitJs/index.html#datepicker_nmonth

 

界面如图

 

继承自之前发布的

http://www.cnblogs.com/xueduanyang/archive/2012/04/12/2444788.html

 

初始化方法为

//默认日历
                window.picker = new $kit.ui.DatePicker.NMonths();
                picker.init();
                $kit.el('#J_datePicker').appendChild(picker.picker);
                picker.show();
                picker.ev({
                    ev : 'change',
                    fn : function(e) {
                        alert(picker.getValue());
                    }
                })
                //输入框下拉
                $kit.ev({
                    el : '#J_input',
                    ev : 'focus',
                    fn : function(e) {
                        var d, ipt = e.target;
                        d = e.target[$kit.ui.DatePicker.defaultConfig.kitWidgetName];
                        if(d) {
                            d.show();
                        } else {
                            d = new $kit.ui.DatePicker.NMonths();
                            d.init();
                            d.adhere($kit.el('#J_input'));
                            d.show();
                        }
                    }
                });
                $kit.ev({
                    el : document,
                    ev : 'click',
                    fn : function(e) {
                        var input = $kit.el('#J_input');
                        d = input[$kit.ui.DatePicker.defaultConfig.kitWidgetName];
                        if(d && !$kit.contains(d.picker, e.target) && input != e.target) {
                            d.hide();
                        }
                    }
                });

 

与之前默认配置参数唯一的区别在于，多了一个配置显示多少个月的参数 nMonths，默认显示3个月，可以改成2个月

 

周末了，如果遇到啥问题，可以留言，下周继续更新，欢迎继续关注kitjshttp://xueduany.github.com/KitJs