本文共 4274 字，大约阅读时间需要 14 分钟。

页面代码：

Javascript代码：

function getCurrentDay()    	{    		var newDate = new Date;    		var odate = document.getElementById("dateText");    		var date_year = newDate.getFullYear();			var date_month = newDate.getMonth() + 1;			var date_today = newDate.getDate();    		odate.value = date_year+"-"+date_month+"-"+date_today;    	}    	function displayCalendar()		{			drawCalendar();		}		function closeCalendar()		{			var oCalendarContainer = document.getElementById("calendarContainer");			oCalendarContainer.innerHTML = "";		}		function drawCalendar(sYear,sMonth)		{			var newDate;			if(arguments[0] == null || arguments[1] == null)			{				newDate = new Date();			}			else			{				newDate = new Date(sYear,sMonth - 1);			}			var date_year = newDate.getFullYear();			var date_month = newDate.getMonth() + 1;			var date_today = newDate.getDate();			var date_day = newDate.getDay();			var nextMonth = date_month + 1;			var nextYear = date_year;			var prevMonth = date_month - 1;			var prevYear = date_year;			if(sMonth == 12)			{				nextMonth = 1;				nextYear = date_year + 1;			}			if(sMonth == 1)			{				prevMonth = 12;				prevYear = date_year - 1;			}			var calendarTable = "";			calendarTable += '
   
    ';			calendarTable += ' 
      ';			//向前翻年			calendarTable += '
';			//向前翻月			calendarTable += '
';			//向后翻月			calendarTable += '
';			 //向后翻年			 calendarTable += '
';			calendarTable += ' 
';			//星期表头			calendarTable += '  
      ';			calendarTable += '      
';			calendarTable += '      
';			calendarTable += '      
';			calendarTable += '      
';			calendarTable += '      
';			calendarTable += '      
';			calendarTable += '      
';			calendarTable += '  
';			//计算一个月内的天数,注意闰月 			var dayNum_in_month = [31,28,31,30,31,30,31,31,30,31,30,31]; 			var isleapyear = date_year % 4; 			if(isleapyear == 0) 			{ 				dayNum_in_month[1] = 29; 			} 			var month_alldays = dayNum_in_month[date_month - 1]; 			//计算行数，line_top表示当前日期上面的行数，包括当前行；line_bot表示当前日期下面的行数，不包括当前行 			var line_top; 			var line_bot; 			if((date_today - date_day + 1) % 7 != 0) 			{ 				line_top = Math.floor((date_today - date_day + 1) / 7) + 1; 			} 			else 			{ 				line_top = Math.floor((date_today - date_day + 1) / 7); 			} 			if((30 - date_today + date_day + 1) % 7 != 0) 			{ 				line_bot = Math.floor((30 - date_today + date_day + 1) / 7) + 1; 			} 			else 			{ 				line_bot = Math.floor((30 - date_today + date_day + 1) / 7); 			} 			//定义一个二维数组，预备一个6*7的数组，数组中每个元素对应一个单元格(日期) 			var dateList = new Array([""],[""],[""],[""],[""],[""],[""]); 			var dateCell; 			for(var i = 1; i < 7; i++) 			{ 				//i是行数 				calendarTable += '  
      '; 				for(var j = 0; j < 7; j++) 				{ 					//j是列数 					dateList[i][j] = date_today - 7 * (line_top - i + 1) + j - date_day; 					//如果武器<=0，置空 					if((date_today - 7 * (line_top - i + 1) + j - date_day) <= 0) 					{ 						dateList[i][j] = " "; 					} 					//如果日期大于月总天数，则不显示 					if((date_today - 7 * (line_top - i + 1) + j - date_day) > month_alldays) 					{ 						dateList[i][j] = " "; 					} 					if(dateList[i][j] != " ") 					{ 						//如果单元格不是空，那么可以设置其触发三个事件，共有三个事件 						//1、单击事件，将当前日期写入文本框 						//2、鼠标指针移到单元格上，改变背景 						//3、鼠标指针离开单元格，背景复原 						dateCell =  									'
'; 						if(i == line_top && j == line_bot) 						{ 							dateCell =  									'
'; 						} 					} 					else 					{ 						dateCell = "
"; 					} 					calendarTable += dateCell; 				} 				calendarTable += '
'; 			} 			calendarTable += '
'; 			calendarTable += '
    
     
      
<<<
      
<<
      
>>
      
>>>
     
     
      
日
      
一
      
二
      
三
      
四
      
五
      
六
     
     
      
'+dateList[i][j]+'
      
'+dateList[i][j]+'
      
 
     
     
      
'+'关闭('+date_year+"年"+date_month+"月"+')
     
    
   
'; 			//将日期写入 			var oCalendarContainer = document.getElementById("calendarContainer"); 			oCalendarContainer.innerHTML = calendarTable; 		} 		//当鼠标指针指到当前日期单元格 		function setFocus(obj) 		{ 			obj.style.backgroundColor = "#FF6600"; 		} 		//当鼠标指针离开当前日期单元格 		function setFocusOut(obj) 		{ 			obj.style.backgroundColor = ""; 		} 		//鼠标单击当前单元格 		function setDateText(sYear,sMonth,sDate) 		{ 			var oDateText = document.getElementById("dateText"); 			oDateText.value = sYear + "-" + sMonth + "-" + sDate; 		}