javascript写日历代码
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<LINK REL=stylesheet HREF="../../images/ntstyles.css" TYPE="text/css">
<title>Canlender--JavaScript</title>
<style>
td {
font-family: Arial, Helvetica, sans-serif;
font-size: 30px;
}
</style>
<script language="JavaScript">
function loadend()
{
parent.funpool.showPage();
}
function Out_Branch(ButtonID)
{
if( ButtonID==0 )
{
if(parent.varpool.RegDate =="")
return 0;
}
parent.funpool.button_Branch(ButtonID);
}
function scrkey()
{
if ( window.event.keyCode == 8 || window.event.keyCode == 9 )
{
window.event.keyCode = 16;
}
}
</script>
</head>
<body background="../../images/background/showtxt.jpg" onload="loadend()" onkeydown="scrkey()">
<div style='position: absolute; width: 790; height: 50; z-index: 1; left: 0px; top: 107px' align="center">
<P class='title1'>请选择预约时间</p>
</div>
<div style='position: absolute; width: 435px; height: 38px; z-index: 1; left: 45px; top: 520px' align="left">
<P class='title1' style="font-size:20px; color:fc0000">温馨提示:预约日期必须大于当前日期</p>
</div>
<div id='layer' style='visibility:;position: absolute; width: 135; height:61px; z-index: 1; left: 481px; top: 515px'>
<a onMouseDown="Out_Branch(2)" class="bt">
<img src="../../images/Button/SubBack.gif" onMouseDown="this.src='../../images/Button/SubBack_down.gif'" onMouseup="this.src='../../images/Button/SubBack.gif'" onMouseout ="this.src='../../images/Button/SubBack.gif'";this.style.cursor='hand'></a></div>
<div id='layer' style='visibility:;position: absolute; width: 135; height:60; z-index: 1; left: 651px; top: 515px'>
<a onMouseDown="Out_Branch(1)" class="bt">
<img src="../../images/Button/EndService.gif" onMouseDown="this.src='../../images/Button/EndService_down.gif'" onMouseup="this.src='../../images/Button/EndService.gif'" onMouseout ="this.src='../../images/Button/EndService.gif'";this.style.cursor='hand'></a></div>
<table border="0" cellpadding="0" cellspacing="0" width="700" hight="300" style=" position:absolute;top:150; left:25;">
<tr><td id=cc>
</td></tr></table>
</body>
<script language="JavaScript">
function RunNian(The_Year)
{
if(The_Year%100==0)
{
if(The_Year%400==0)
return true;
else
return false;
}
else
{
if(The_Year%4==0)
return true;
else
return false;
}
}
function GetWeekday(The_Year,The_Month)
{
var Allday = 0;
//alert("The_Year="+The_Year);
if (The_Year>2000)
{
for (i=2000 ;i<The_Year; i++)
if (RunNian(i))
Allday += 366;
else
Allday += 365;
for (i=1; i<The_Month; i++)
{
switch (i)
{
case 1 : Allday += 31; break;
case 2 :
if (RunNian(The_Year))
Allday += 29;
else
Allday += 28;
break;
case 3 : Allday += 31; break;
case 4 : Allday += 30; break;
case 5 : Allday += 31; break;
case 6 : Allday += 30; break;
case 7 : Allday += 31; break;
case 8 : Allday += 31; break;
case 9 : Allday += 30; break;
case 10 : Allday += 31; break;
case 11 : Allday += 30; break;
case 12 : Allday += 31; break;
}
}
}
//alert("Allday="+Allday);
return (Allday+6)%7;
}
function chooseday(The_Year,The_Month,The_Day)
{
var Firstday;
var completely_date;
var The_MonthR,The_DayR;
//completely_date = The_Year + "-" + The_Month + "-" + The_Day;
//else
//completely_date = "No Choose";
//showdate 只是一个为了显示而采用的东西，
//如果外部想引用这里的时间，可以通过使用 completely_date引用完整日期
//也可以通过The_Year,The_Month,The_Day分别引用年，月，日
//当进行月份和年份的选择时，认为没有选择完整的日期
Firstday = GetWeekday(The_Year,The_Month);
//alert("Firstday="+Firstday);
ShowCalender(The_Year,The_Month,The_Day,Firstday);
}
function GetThisDate(The_Year,The_Month,The_Day)
{
var The_MonthR,The_DayR;
if(Number(The_Month)<10)
The_MonthR = "0" + The_Month;
else
The_MonthR = The_Month;
if(Number(The_Day) < 10)
The_DayR = "0" + The_Day;
else
The_DayR = The_Day;
parent.varpool.RegDate = The_Year+""+The_MonthR+The_DayR;
Out_Branch(0);
//parent.funpool.button_Branch(0);
// alert(The_Year+""+The_MonthR+The_DayR);
}
function nextmonth(The_Year,The_Month)
{
if (The_Month==12)
chooseday(The_Year+1,1,1);
else
chooseday(The_Year,The_Month+1,1);
}
function prevmonth(The_Year,The_Month)
{
if (The_Month==1)
chooseday(The_Year-1,12,1);
else
chooseday(The_Year,The_Month-1,1);
}
function prevyear(The_Year,The_Month)
{
chooseday(The_Year-1,The_Month,1);
}
function nextyear(The_Year,The_Month)
{
chooseday(The_Year+1,The_Month,1);
}
function ShowCalender(The_Year,The_Month,The_Day,Firstday)
{
var showstr;
var Month_Day;
var ShowMonth;
var today;
var Tcolor;
today = new Date();
switch (The_Month)
{
case 1 : ShowMonth = "1月"; Month_Day = 31; break;
case 2 :
ShowMonth = "2月";
if (RunNian(The_Year))
Month_Day = 29;
else
Month_Day = 28;
break;
case 3 : ShowMonth = "3月"; Month_Day = 31; break;
case 4 : ShowMonth = "4月"; Month_Day = 30; break;
case 5 : ShowMonth = "5月"; Month_Day = 31; break;
case 6 : ShowMonth = "6月"; Month_Day = 30; break;
case 7 : ShowMonth = "7月"; Month_Day = 31; break;
case 8 : ShowMonth = "8月"; Month_Day = 31; break;
case 9 : ShowMonth = "9月"; Month_Day = 30; break;
case 10 : ShowMonth = "10月"; Month_Day = 31; break;
case 11 : ShowMonth = "11月"; Month_Day = 30; break;
case 12 : ShowMonth = "12月"; Month_Day = 31; break;
}
showstr = "";
showstr = "<Table cellpadding=0 cellspacing=0 border=1 bordercolor=#acbad5 width=95% align=center valign=top>";
showstr += "<tr><td width=0 style=′cursor:hand′ onclick=prevyear("+The_Year+"," + The_Month + ")><<</td><td width=0> " + The_Year + " </td><td width=0 onclick=nextyear("+The_Year+","+The_Month+") style=′cursor:hand′>>></td><td width=0 style=′cursor:hand′ onclick=prevmonth("+The_Year+","+The_Month+")><<</td><td width=100 align=center>" + ShowMonth + "</td><td width=0 onclick=nextmonth("+The_Year+","+The_Month+") style=′cursor:hand′>>></td></tr>";
showstr += "<tr><td align=center width=100% colspan=6>";
showstr += "<table cellpadding=2 cellspacing=2 border=2 bordercolor=#fffcff width=100%>";
showstr += "<Tr align=center bgcolor=#95b8f8> ";
showstr += "<td><strong><font color=#daedff>日</font></strong></td>";
showstr += "<td><strong><font color=#daedff>一</font></strong></td>";
showstr += "<td><strong><font color=#daedff>二</font></strong></td>";
showstr += "<td><strong><font color=#daedff>三</font></strong></td>";
showstr += "<td><strong><font color=#daedff>四</font></strong></td>";
showstr += "<td><strong><font color=#daedff>五</font></strong></td>";
showstr += "<td><strong><font color=#daedff>六</font></strong></td>";
showstr += "</Tr><tr>";
//alert("Firstday="+Firstday);
for (var i=1; i<=Firstday; i++)
showstr += "<Td align=center bgcolor=#CCCCCC> </Td>";
for (var i=1; i<=Month_Day; i++)
{
//日期控制------------------------------------------
if(Number(The_Month) < 10)
var The_Month1 = "0" + The_Month;
else
var The_Month1 = The_Month;
if(i<10)
var Month_Day1 = "0" + i;
else
Month_Day1 = i;
var test1 = The_Year +"-"+The_Month1+"-"+Month_Day1;
var thisDate = today.getFullYear() + "-" + (today.getMonth()+1) +"-"+ today.getDate();
var sDate=thisDate;
var eDate=test1;
var sArr = sDate.split("-");
var eArr = eDate.split("-");
var sRDate = new Date(sArr[0], sArr[1], sArr[2]);
var eRDate = new Date(eArr[0], eArr[1], eArr[2]);
var result = (eRDate-sRDate)/(24*60*60*1000);
if(result>=1&&result<37)
{
bgColor = "#fc0000";
Tcolor = "#000000";
showstr += "<td align=center style='color:"+Tcolor+"' bgcolor=" + bgColor + " style=′cursor:hand′ onclick=GetThisDate(" + The_Year + "," + The_Month + "," + i + ")>" + i + "</td>";
}
//日期控制-------------------------------------------
else
{
bgColor = "#fbfaf8";
Tcolor = "#d8dde3";
//xx mv
//showstr += "<td align=center style='color:"+Tcolor+"' bgcolor=" + bgColor + " style=′cursor:hand′ onclick=GetThisDate(" + The_Year + "," + The_Month + "," + i + ")>" + i + "</td>";
showstr += "<td align=center style='color:"+Tcolor+"' bgcolor=" + bgColor + " style=′cursor:hand′ onclick=chooseday(" + The_Year + "," + The_Month + "," + i + ")>" + i + "</td>";
}
Firstday = (Firstday+1)%7;
if ((Firstday==0) && (i!=Month_Day))
showstr += "</tr><tr>";
}
if (Firstday!=0)
{
for (i=Firstday; i<7; i++)
showstr += "<td align=center bgcolor=#CCCCCC> </td>";
showstr += "</tr>";
}
showstr += "</tr></table></td></tr></table>";
cc.innerHTML = showstr;
}
</script>
<script language="JavaScript">
var The_Year,The_Day,The_Month;
var today;
var Firstday;
today = new Date();
The_Year = today.getFullYear();
//alert("The_Year="+The_Year);
The_Month = today.getMonth() + 1;
The_Day = today.getDate();
Firstday = GetWeekday(The_Year,The_Month);
ShowCalender(The_Year,The_Month,The_Day,Firstday);
</script>
</html>
