Javascript月历仅显示周数

Question

我正在寻找能够显示x个月数的日历，然后在这些月份显示周数以及显示事件，如下所示。

蓝色虚线是今天的日期，可能有多个具有开始和结束日期的事件。

这是我到目前为止所尝试的http://jsfiddle.net/vc1f3f4x/1/ - 问题是它显示的是4个月而不是3个月我还没有参加这些活动。

var monthNames = ["January", "February", "March", "April", "May", "June",
                  "July", "August", "September", "October", "November", "December"
                 ];

var data = new Object();

data.Months = {};
data.Weeks = new Array();

var start = new Date();
var end = new Date();
start.setDate(1);

end.setMonth(start.getMonth() + 3);

var weekNumber = getWeekNumber(start);
var currentYear = start.getYear();

for (var dt = start; start <= end; dt.setDate(dt.getDate() + 7)) {
    if (dt.getYear() > currentYear) {
        currentYear = dt.getYear();
        weekNumber = 1;
    }

    weekNumber++;

    var id = dt.getMonth() + "_" + dt.getYear();

    data.Months[id] = monthNames[dt.getMonth()];
    data.Weeks.push(weekNumber);
}

// Run through each month and add it to dom
for (var month in data.Months) {
    $(".Content").append("<div class='Month'>" + data.Months[month] + "</div>");
}

// Then run through each week and add it to dom
for (var i = 0; i < data.Weeks.length; i++) {
    $(".Content").append("<div class='Week'>" + data.Weeks[i] + "</div>");
}

function getWeekNumber(d) {
    // Copy date so don't modify original
    d = new Date(+d);
    d.setHours(0, 0, 0);
    // Set to nearest Thursday: current date + 4 - current day number
    // Make Sunday's day number 7
    d.setDate(d.getDate() + 4 - (d.getDay() || 7));
    // Get first day of year
    var yearStart = new Date(d.getFullYear(), 0, 1);
    // Calculate full weeks to nearest Thursday
    var weekNo = Math.ceil((((d - yearStart) / 86400000) + 1) / 7);
    // Return array of year and week number
    return weekNo;
}

是否有一个组件可以为我执行此操作，还是需要从头开始创建它？

编辑：我刚刚意识到我的代码并没有处理有5个星期的月份。

Answer 1

它显示了四个，因为你正在做当月的PLUS 3，这实际上是4个月。

您将开始日期设置为当月的第一个，然后将3添加到其中以设置结束日期的月份。

我建议使用moment.js进行日期操作，我觉得它对日期做任何事都非常有用。