js日历

  1 /**
  2  * @author qiaoYang
  3  * @time 2012.8.10
  4  */
  5 
  6 var day = new Date();
  7 //申明一个数组存储每个月的天数
  8 var monthOfDays = new Array(31,28,31,30,31,30,31,31,30,31,30,31);
  9 //存储星期的数组
 10 var weeksArray = new Array("Sun","Mon","Tue","Wed","Thu","Fri","Sat");
 11 //存储月份的数组
 12 var monthss = new Array("January","February","March","April","May","June","July","August","September","October","November","December");
 13 
 14 /**
 15  * @func
 16  */
 17 function loadFunction(func){
 18     var oldOnLoad = window.onload;
 19     if(typeof window.onload != "function"){
 20         window.onload = func;
 21     }else{
 22         window.onload = function(){
 23             oldOnLoad();
 24             func();
 25         };
 26     }
 27 }
 28 
 29 /**
 30  * 判断年份是否为闰年
 31  * @param year 
 32  * @returns {Number}
 33  */
 34 
 35 function isLeap(year){
 36     if((year%4 ==0) || (year%100 == 0 && year%400 ==0))
 37         return 1;
 38     else
 39         return 0;
 40 }
 41 
 42 /**
 43  * 计算每个月的第一天是星期几的函数
 44  * @param year
 45  * @param month
 46  * @returns
 47  */
 48 function calFirstOfMonth(year, month){
 49     var day = new Date(year,month,1);
 50     return day.getDay();
 51 }
 52 
 53 /**
 54  * 计算需要的表格的行数
 55  * @param year 表示的年份
 56  * @param months 表示的月份
 57  * @param blanks 表示1号与星期几对齐
 58  * @returns
 59  */
 60 function calRows(year, months, blanks){
 61     if(isLeap(year) && months == 1){
 62         monthOfDays[1] = 29;
 63     }
 64     return Math.ceil((monthOfDays[months]+blanks)/7);
 65 }
 66 
 67 
 68 /**
 69  * 设置选择以后的年份
 70  * @param year
 71  */
 72 function setYear(year){
 73     alert("hello");
 74     if(year)
 75         day.setFullYear(year);
 76 }
 77 
 78 /**
 79  * 设置选择以后的月份
 80  * @param month
 81  */
 82 function setMon(month){
 83     if(month)
 84         day.setMonth(month);
 85 }
 86 
 87 /**
 88  * 程序初始化
 89  */
 90 function init(){
 91     var today = day;
 92     document.write("<form name='cal'><table bgcolor='f8f8f8' border='1'><tr>");
 93     document.write("<td colspan='7' bgcolor='#f8f8f8' >");
 94     document.write("<select name='years' onchange='setYear(2011)' style=' 190px'>");
 95     for(var i = 1950; i<2500; i++)
 96         if(i != today.getFullYear())
 97             document.write("<option value=" + i +">"+i);
 98         else
 99             document.write("<option value=" + i +" selected='true'>"+i);
100     document.write("</select>");
101     document.write("<select name='months' style=' 200px'>");
102     for(var i = 1; i<13; i++)
103         if(i != today.getMonth()+1)
104             document.write("<option value=" + i +">"+monthss[i-1]);
105         else
106             document.write("<option value=" + i +" selected='true'>"+monthss[i-1]);
107     document.write("</select>");
108     document.write("</td></tr><tr>");
109     for(var i = 0; i < weeksArray.length; i++){
110         document.write("<td width='40' align='center'>" + weeksArray[i] + "</td>");
111     }
112     document.write("</tr>");
113     //计算空格数
114     var blankNumber = calFirstOfMonth(today.getFullYear(), today.getMonth());
115     //计算所需行数
116     var rowsNumber = calRows(today.getFullYear(), today.getMonth(), blankNumber);
117     for(var i = 0; i<rowsNumber; i++){
118         document.write("<tr>");
119         for(var j = 0; j < 7; j++){
120             if((i == 0 && j < blankNumber) || ((i*7+j-blankNumber+1) > monthOfDays[today.getMonth()] )){
121                 document.write("<td width='40'>&nbsp;</td>");
122             }else{
123                 document.write("<td width='40' align='center'>" +(i*7+j-blankNumber+1) + "</td>" );
124             }
125         }
126     }
127     document.write("</tr></table></form>");
128 }
129 
130 loadFunction(init);