js自定义日历

function getDate(year,month){              
           var thisDate,thisDay,week,preLastDay;
           var endDate,endDay,endWeek,dayMount;
           var startArr = []; //上月数据
           var endArr = [];   //下月数据
           var html = '';
           var today = new Array('日','一','二','三','四','五','六');
           thisDate = month + "/1/" + year;
           thisDay = new Date(Date.parse(thisDate));    //本月第一天 Date.parse()指定的日期和时间据 1970/1/1 午夜(GMT 时间)之间的毫秒数。
           week = today[thisDay.getDay()]; //本月第一天是周几  getDay()方法可返回一周(0~6)的某一天的数字。

           if(month == 2){ //闰月的判断 endDate:本月结束日期 2020-**-** dayMount:本月天数
             preLastDay = 31; //上个月的最后一天
             if((year % 4 == 0 && year % 100 != 0) || year % 400 == 0){
               endDate = month + "/29/" + year;
               dayMount = 29;
             }else{
               endDate = month + "/28/" + year;
               dayMount = 28;
             }
             //$.inArray()函数用于在数组中搜索指定的值,并返回其索引值。如果数组中不存在该值,则返回-1;
           }else if($.inArray(month,[4,6,9,11]) != -1){
             preLastDay = 31;
             endDate = month + "/30/" + year;
             dayMount = 30;
           }else if($.inArray(month,[1,3,5,7,8,10,12]) != -1){
             if(month == 1){
               preLastDay = 31;
             }else if(month == 3){
               if((year % 4 == 0 && year % 100 != 0) || year % 400 == 0){
                 preLastDay = 29;
               }else{
                 preLastDay = 28;
               }
             }else if(month == 8){
               preLastDay = 31;
             }else{
               preLastDay = 30;
             }
             endDate = month + "/31/" + year;
             dayMount = 31;
           }
           endDay = new Date(Date.parse(endDate)); //结束日期
           endWeek = today[endDay.getDay()];    //结束日是周几

           if(week == '日'){
             startArr = [];
           }else if(week == '一'){
             startArr = [preLastDay];
           }else if(week == '二'){
             for(var i=preLastDay-1;i<=preLastDay;i++){
               startArr.push(i);
             }
           }else if(week == '三'){
             for(var i=preLastDay-2;i<=preLastDay;i++){
               startArr.push(i);
             }
           }else if(week == '四'){
             for(var i=preLastDay-3;i<=preLastDay;i++){
               startArr.push(i);
             }
           }else if(week == '五'){
             for(var i=preLastDay-4;i<=preLastDay;i++){
               startArr.push(i);
             }
           }else if(week == '六'){
             for(var i=preLastDay-5;i<=preLastDay;i++){
               startArr.push(i);
             }
           }

           if(endWeek == '日'){
             for(var i=1;i<=6;i++){
               endArr.push(i);
             }
           }else if(endWeek == '一'){
             for(var i=1;i<=5;i++){
               endArr.push(i);
             }
           }else if(endWeek == '二'){
             for(var i=1;i<=4;i++){
               endArr.push(i);
             }
           }else if(endWeek == '三'){
             for(var i=1;i<=3;i++){
               endArr.push(i);
             }
           }else if(endWeek == '四'){
             for(var i=1;i<=2;i++){
               endArr.push(i);
             }
           }else if(endWeek == '五'){
             endArr = [1];
           }else if(endWeek == '六'){
             endArr = [];
           }

            if(startArr.length > 0){ //上月循环
              for(var i=0;i<startArr.length;i++){
                html += "<div class='perDate clearfix'>"
                   + "<div class='days'></div>"
                 + "<div class='ifWork' id=''></div>"
                 + "</div>";
              }
            }
            for(var i=1;i<=dayMount;i++){ //本月循环
              var dayStr = getDayStr(i);
              var monthStr = getDayStr(month);
              var newDays = year + '-' + monthStr + '-' + dayStr;
              var newDate = dayStr;

              html += "<div class='perDate clearfix' id='"+ newDays +"'>"
                   + '<div class="days">'+ newDate +'<input type="hidden" name="schedulingDay" value='+ newDate +'></div>'
                 + '<div class="ifWork" id="">'
                 + '<select name="schedulingState" id="month">'
                 + '<option class="month" value="">请选择</option>'
                 + '<c:forEach var="status" items="${mstList}" varStatus="num">'
                 + '<option class="month" value="${status.itemCodeTwo}">${status.itemNameTwo}</option>'
                 + '</c:forEach>'                 
                 + '</select>'
                 + '</div>'
                 + '</div>';
            }
            for(var i=0;i<endArr.length;i++){ //下月循环
               html += "<div class='perDate clearfix'>"
                    + "<div class='days'></div>"
                  + "<div class='ifWork' id=''></div>"
                  + "</div>";


            }          
            $("#dates").append(html);            
     }
     
     function getDayStr(i){ //01日
           var iStr = '';
           if(i.toString().length == 1){
             iStr = '0' + i;
           }else if(i.toString().length == 2){
             iStr = i;
           }
           return iStr;
        }

效果图

Guess you like

Origin blog.csdn.net/c15162/article/details/109447195