日历显示24小时制,我需要12小时制

时间:2015-01-28 06:11:43

标签: javascript

我有这个电子日历JavaScript代码,显示24小时时钟格式。你怎么把它换成12小时制?原谅切碎的代码,我不得不删除一些来创建帖子。 我已经发布了以下代码:

(function ($) {

var eCalendar = function (options, object) {
    // Initializing global variables
    var adDay = new Date().getDate();
    var adMonth = new Date().getMonth();
    var adYear = new Date().getFullYear();
    var dDay = adDay;
    var dMonth = adMonth;
    var dYear = adYear;
    var instance = object;



    var settings = $.extend({}, $.fn.eCalendar.defaults, options);


    function print() {
        loadEvents();
        var dWeekDayOfMonthStart = new Date(dYear, dMonth, 1).getDay();
        var dLastDayOfMonth = new Date(dYear, dMonth + 1, 0).getDate();
        var dLastDayOfPreviousMonth = new Date(dYear, dMonth + 1, 0).getDate() - dWeekDayOfMonthStart + 1;

        var cBody = $('<div/>').addClass('c-grid');
        var cEvents = $('<div/>').addClass('c-event-grid');
        var cEventsBody = $('<div/>').addClass('c-event-body');
        cEvents.append($('<div/>').addClass('c-event-title c-pad-top').html(settings.eventTitle));
        cEvents.append(cEventsBody);
        var cNext = $('<div/>').addClass('c-next c-grid-title c-pad-top');
        var cMonth = $('<div/>').addClass('c-month c-grid-title c-pad-top');
        var cPrevious = $('<div/>').addClass('c-previous c-grid-title c-pad-top');
        cPrevious.html(settings.textArrows.previous);
        cMonth.html(settings.months[dMonth] + ' ' + dYear);
        cNext.html(settings.textArrows.next);

        cPrevious.on('mouseover', mouseOver).on('mouseleave', mouseLeave).on('click', previousMonth);
        cNext.on('mouseover', mouseOver).on('mouseleave', mouseLeave).on('click', nextMonth);

        cBody.append(cPrevious);
        cBody.append(cMonth);
        cBody.append(cNext);
        for (var i = 0; i < settings.weekDays.length; i++) {
            var cWeekDay = $('<div/>').addClass('c-week-day c-pad-top');
            cWeekDay.html(settings.weekDays[i]);
            cBody.append(cWeekDay);
        }
        var day = 1;
        var dayOfNextMonth = 1;
        for (var i = 0; i < 42; i++) {
            var cDay = $('<div/>');
            if (i < dWeekDayOfMonthStart) {
                cDay.addClass('c-day-previous-month c-pad-top');
                cDay.html(dLastDayOfPreviousMonth++);
            } else if (day <= dLastDayOfMonth) {
                cDay.addClass('c-day c-pad-top');
                if (day == dDay && adMonth == dMonth && adYear == dYear) {
                    cDay.addClass('c-today');
                }
                for (var j = 0; j < settings.events.length; j++) {
                    var d = settings.events[j].datetime;
                    if (d.getDate() == day && (d.getMonth() - 1) == dMonth && d.getFullYear() == dYear) {
                        cDay.addClass('c-event').attr('data-event-day', d.getDate());
                        cDay.on('mouseover', mouseOverEvent).on('mouseleave', mouseLeaveEvent);
                    }
                }
                cDay.html(day++);
            } else {
                cDay.addClass('c-day-next-month c-pad-top');
                cDay.html(dayOfNextMonth++);
            }
            cBody.append(cDay);
        }
        var eventList = $('<div/>').addClass('c-event-list');
        for (var i = 0; i < settings.events.length; i++) {
            var d = settings.events[i].datetime;
            if ((d.getMonth() - 1) == dMonth && d.getFullYear() == dYear) {
                var date = lpad(d.getDate(), 2) + '/' + lpad(d.getMonth(), 2) + ' ' + lpad(d.getHours(), 2) + ':' + lpad(d.getMinutes(), 2);
                var item = $('<div/>').addClass('c-event-item');
                var title = $('<div/>').addClass('title').html(date + '  ' + settings.events[i].title + '<br />');
                var description = $('<div/>').addClass('description').html(settings.events[i].description + '<br />');
                item.attr('data-event-day', d.getDate());
                item.on('mouseover', mouseOverItem).on('mouseleave', mouseLeaveItem);
                item.append(title).append(description);
                eventList.append(item);
            }
        }
        $(instance).addClass('calendar');
        cEventsBody.append(eventList);
        $(instance).html(cBody).append(cEvents);
    }

    return print();
}

$.fn.eCalendar = function (oInit) {
    return this.each(function () {
        return eCalendar(oInit, $(this));
    });
};



}(jQuery));

1 个答案:

答案 0 :(得分:0)

getHours返回范围0-23,因此如果它大于11,则减去12。

你甚至可以看上去像

(getHours()+ 24)%12 || 12

相关问题