zoukankan      html  css  js  c++  java
  • JS获取当月windows显示的日历(简易版本)

    JS代码:

    /**
     * 要求格式yyyy-MM
     * @param {Object} currentMonth 当前月份
     */
    function getCalendar(currentMonth) {
        if(currentMonth.indexOf("-") < 0) {
            return;
        }
        var calendar = [];
        var myDate = currentMonth.split("-")[1] * 1;
        computeDate(currentMonth).forEach((item, index) => {
            var iscurrentmonth = false;
            if(myDate == item.split("-")[1] * 1) {
                iscurrentmonth = true;
            }
            calendar.push({
                "week": new Date(item).getDay() == 0 ? 7 : new Date(item).getDay(),
                "date": item,
                "iscurrentmonth": iscurrentmonth
            });
        });
        return calendar;
    }
    
    /**
     * 要求格式yyyy-MM
     * @param {Object} currentMonth 当前月份
     */
    function computeDate(currentMonth) {
        if(currentMonth.indexOf("-") < 0) {
            return;
        }
        var myDate = currentMonth.split("-");
        // 上个月的需要显示的天数
        var preMonthDate = [];
        // 当月需要显示的天数
        var currentMonthDate = [];
        // 下个月需要显示的天数
        var nextMonthDate = [];
        // 显示的总格数
        var total = 6 * 7;
        var currentMonthDays = getMonthDays(myDate[0], myDate[1]);
    
        // 当前月1号是周几
        var week = (new Date(currentMonth + '-01').getDay() == 0 ? 7 : new Date(currentMonth + '-01').getDay()) - 1;
        // 存储上月要显示的日期
        if(week > 0) {
            var dateTime = new Date(currentMonth + "-01");
            for(var i = 0; i < week; i++) {
                dateTime = dateTime.setDate(dateTime.getDate() - 1);
                dateTime = new Date(dateTime);
                preMonthDate.push(getNowFormatDate(dateTime));
            }
            preMonthDate.reverse();
        }
        //console.info(preMonthDate);
    
        // 存储当月要显示的日期
        var currentTime = new Date(currentMonth + "-01");
        currentMonthDate.push(getNowFormatDate(currentTime));
        for(var i = 0; i < currentMonthDays - 1; i++) {
            currentTime = currentTime.setDate(currentTime.getDate() + 1);
            currentTime = new Date(currentTime);
            currentMonthDate.push(getNowFormatDate(currentTime));
        }
        //console.info(currentMonthDate);
    
        // 存储下个月的日期
        var nextDays = (total - currentMonthDays - week);
        if(nextDays > 0) {
            var nextYear = myDate[0];
            var nextMonth = myDate[1];
            if(myDate[1] >= 12) {
                nextMonth = 1;
                nextYear++;
            } else {
                nextMonth++;
            }
            var nextTime = new Date(nextYear + "-" + nextMonth + "-01");
    
            nextMonthDate.push(getNowFormatDate(nextTime));
            for(var i = 0; i < nextDays - 1; i++) {
                nextTime = nextTime.setDate(nextTime.getDate() + 1);
                nextTime = new Date(nextTime);
                nextMonthDate.push(getNowFormatDate(nextTime));
            }
        }
        //console.info(nextMonthDate);
    
        // 合并数据
        return preMonthDate.concat(currentMonthDate, nextMonthDate);
    }
    
    /**
     * 获取当月天数
     * @param {Object} year 年份
     * @param {Object} month 月份
     */
    function getMonthDays(year, month) {
        return new Date(year, month, 0).getDate();
    }
    
    /**
     * 返回格式 yyyy-MM-dd
     * @param {Object} date
     */
    function getNowFormatDate(date) {
        var seperator1 = "-";
        var year = date.getFullYear();
        var month = date.getMonth() + 1;
        var strDate = date.getDate();
        if(month >= 1 && month <= 9) {
            month = "0" + month;
        }
        if(strDate >= 0 && strDate <= 9) {
            strDate = "0" + strDate;
        }
        var currentdate = year + seperator1 + month + seperator1 + strDate;
        return currentdate;
    }

    使用方式:

    例子:
    getCalendar("2021-01")

    结果如下:

  • 相关阅读:
    如何理解面向对象和面向过程
    IIS端口被占用
    SQL UNION操作符
    SQL(MSSQLSERVER)服务启动错误代码3414
    WCF学习之路(一)
    AJAX技术学习总结
    AJAX之XMLHttpRequest对象
    软考之汇编语言
    IP地址的分配
    数组偏移量
  • 原文地址:https://www.cnblogs.com/xiejn/p/14347401.html
Copyright © 2011-2022 走看看