Edit in JSFiddle

$.fn.createCalendar = function () {
    
    // 返回一个对象，包含：
    // - 日期数组
    // - 该月第一天 在数组中的索引值
    // - 该月最后一天 在数组中的索引值
    var getMonthInfo = function (year, month) {
        
        var arr = [],
            
            // 该月份的天数
            totalDays = new Date(year, month + 1, 0).getDate(),
            
            // 前一个月份的天数
            lastTotalDays = new Date(year, month, 0).getDate(),
            
            // 该月1日的星期
            weekDay = new Date(year, month, 1).getDay(),
            
            len = 42,
            i, num;
        
        if (weekDay === 0) weekDay = 7;
        
        // 填充前一个月的日期
        for (i = weekDay - 1, num = lastTotalDays; i >= 0; i--, num--) {
            arr[i] = num;
        }
        
        // 填充该月及下一月的日期
        for (i = weekDay, num = 1; i < 42; i++, num++) {
            arr[i] = num > totalDays ? num - totalDays : num;
        }
        
        return {
            dayArr: arr,
            firstDay: weekDay,
            lastDay: weekDay + totalDays - 1
        };
        
    };
    
    var getDayHTML = function (arr, first, last) {
        var str = '',
            elem, i, len;
        
        for (i = 0, len = arr.length; i < len; i++) {
            str += '<li>' + arr[i] + '</li>';
        }
        
        elem = $(str);
        
        // 分配类名
        elem.addClass('calendar__day')
        .eq(first)
        .addClass('calendar__day--first')
        .end()
        .eq(last)
        .addClass('calendar__day--last');
        
        
        return elem;
    };
    
    return this.each(function () {
        var $me = $(this),
            currentTime = new Date(),
            currentYear = currentTime.getFullYear(),
            currentMonth = currentTime.getMonth();
        
        $me
        // 绘制
        .on('draw.calendar', function (e, year, month) {
            var $this = $(this),
                obj = getMonthInfo(year, month),
                str = getDayHTML(obj.dayArr, obj.firstDay, obj.lastDay);
            
            // 记录当前显示的日期
            $me.data('calendar.currentDate', {
                year: year,
                month: month
            });
            
            $this.html(str);
        })
        
        // 初始化
        .on('init.calendar', function () {
            $(this).triggerHandler('draw.calendar', [currentYear, currentMonth]);
        })
        
        // 显示 前一个月
        .on('prev.calendar', function () {
            var $this = $(this),
                month = $this.data('calendar.currentDate').month - 1,
                year = $this.data('calendar.currentDate').year;
            
            if (month < 0) {
                month = 11;
                year = year - 1;
            }
            
            $this.triggerHandler('draw.calendar', [year, month]);
        })
        
        // 显示 下一个月
        .on('next.calendar', function () {
            var $this = $(this),
                month = $this.data('calendar.currentDate').month + 1,
                year = $this.data('calendar.currentDate').year;
            
            if (month > 11) {
                month = 1;
                year = year + 1;
            }
            
            $this.triggerHandler('draw.calendar', [year, month]);
        })
        
        // 初始化日历
        .triggerHandler('init.calendar')
        
    });
    
};

// 日历
var $calendar = $('.calendar__day-block'),
    $prevButton = $('.calendar__prev-button'),
    $nextButton = $('.calendar__next-button'),
    $calendarTitle = $('.calendar__title'),
    monthName = [
        'January', 'February', 'March',
        'April', 'May', 'June',
        'July', 'Aguest', 'September',
        'October', 'November', 'December'
    ];

$calendar.createCalendar();

$calendarTitle
    .on('update', function() {
        var $this = $(this),
            currentDate, year, month;
        
        // 获取当前日期
        currentDate = $calendar.data('calendar.currentDate');
        year = currentDate.year;
        month = currentDate.month;
        
        // 显示当前日期
        $calendarTitle.html(monthName[month] + ' ' + year);
    })
    .triggerHandler('update');

$prevButton.on('click', function(e) {
    
    // 显示下一个月份
    $calendar.triggerHandler('prev.calendar');
    
    // 显示当前日期
    $calendarTitle.triggerHandler('update');
    
    e.preventDefault();
});

$nextButton.on('click', function(e) {
    
    // 显示下一个月份
    $calendar.triggerHandler('next.calendar');
    
    // 显示当前日期
    $calendarTitle.triggerHandler('update');
    
    e.preventDefault();
});