| <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>日历</title>
<style type="text/css">
<!--
body { font-size: 9pt}
table { font-size: 9pt}
a { text-decoration: none}
-->
</style>
<script language="JavaScript">
<!--
var Selected_Month;
var Selected_Year;
var Current_Date = new Date();
var Current_Month = Current_Date.getMonth();
var Days_in_Month = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
var Month_Label = new Array('一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月');
var Current_Year = Current_Date.getYear();
var Today = Current_Date.getDate();
function Header(Year, Month) {
if (Month == 1) {
if ((Year % 400 == 0) || ((Year % 4 == 0) && (Year % 100 != 0))) {
Days_in_Month[1] = 29;
}
}
var Header_String = Year + '年' + Month_Label[Month];
return Header_String;
}
function Make_Calendar(Year, Month) {
var First_Date = new Date(Year, Month, 1);
var Heading = Header(Year, Month);
var First_Day = First_Date.getDay() + 1;
if (((Days_in_Month[Month] == 31) && (First_Day >= 6)) ||
((Days_in_Month[Month] == 30) && (First_Day == 7))) {
var Rows = 6;
}
else if ((Days_in_Month[Month] == 28) && (First_Day == 1)) {
var Rows = 4;
}
else {
var Rows = 5;
}
var HTML_String = '<table><tr><td valign="top"><table BORDER=2 CELLSPACING=1 cellpadding=2 FRAME="box" BGCOLOR="C0C0C0" BORDERCOLORLIGHT="808080">';
HTML_String += '<tr><th colspan=7 BGCOLOR="FFFFFF" BORDERCOLOR="000000">' + Heading + '</font></th></tr>';
HTML_String += '<tr><th ALIGN="CENTER" BGCOLOR="FFFFFF" BORDERCOLOR="000000">日</th><th ALIGN="CENTER" BGCOLOR="FFFFFF" BORDERCOLOR="000000">一</th><th ALIGN="CENTER" BGCOLOR="FFFFFF" BORDERCOLOR="000000">二</th><th ALIGN="CENTER" BGCOLOR="FFFFFF" BORDERCOLOR="000000">三</th>';
HTML_String += '<th ALIGN="CENTER" BGCOLOR="FFFFFF" BORDERCOLOR="000000">四</th><th ALIGN="CENTER" BGCOLOR="FFFFFF" BORDERCOLOR="000000">五</th><th ALIGN="CENTER" BGCOLOR="FFFFFF" BORDERCOLOR="000000">六</th></tr>';
var Day_Counter = 1;
var Loop_Counter = 1;
for (var j = 1; j <= Rows; j++) {
HTML_String += '<tr ALIGN="left" VALIGN="top">';
for (var i = 1; i < 8; i++) {
if ((Loop_Counter >= First_Day) && (Day_Counter <= Days_in_Month[Month])) {
if ((Day_Counter == Today) && (Year == Current_Year) && (Month == Current_Month)) {
HTML_String += '<td BGCOLOR="FFFFFF" BORDERCOLOR="000000"><strong><font color="red">' + Day_Counter + '</font></strong></td>';
}
else {
HTML_String += '<td BGCOLOR="FFFFFF" BORDERCOLOR="000000">' + Day_Counter + '</td>';
}
Day_Counter++;
}
else {
HTML_String += '<td BORDERCOLOR="C0C0C0"> </td>';
}
Loop_Counter++;
}
HTML_String += '</tr>';
}
HTML_String += '</table></td></tr></table>';
document.all.Calendar.innerHTML = HTML_String;
}
function Check_Nums() {
if ((event.keyCode < 48) || (event.keyCode > 57)) {
return false;
}
}
function On_Year() {
var Year = document.when.year.value;
if (Year.length == 4) {
Selected_Month = document.when.month.selectedIndex;
Selected_Year = Year;
Make_Calendar(Selected_Year, Selected_Month);
}
}
function On_Month() {
var Year = document.when.year.value;
if (Year.length == 4) {
Selected_Month = document.when.month.selectedIndex;
Selected_Year = Year;
Make_Calendar(Selected_Year, Selected_Month);
}
else {
alert('Please enter a valid year.');
document.when.year.focus();
}
}
function Defaults() {
if (!document.all)
return
var Mid_Screen = Math.round(document.body.clientWidth / 2);
document.when.month.selectedIndex = Current_Month;
document.when.year.value = Current_Year;
Selected_Month = Current_Month;
Selected_Year = Current_Year;
Make_Calendar(Current_Year, Current_Month);
}
function Skip(Direction) {
if (Direction == '+') {
if (Selected_Month == 11) {
Selected_Month = 0;
Selected_Year++;
}
else {
Selected_Month++;
}
}
else {
if (Selected_Month == 0) {
Selected_Month = 11;
Selected_Year--;
}
else {
Selected_Month--;
}
}
Make_Calendar(Selected_Year, Selected_Month);
document.when.month.selectedIndex = Selected_Month;
document.when.year.value = Selected_Year;
}
function tick() {
var hours, minutes, seconds, xfile;
var intHours, intMinutes, intSeconds;
var today;
today = new Date();
intHours = today.getHours();
intMinutes = today.getMinutes();
intSeconds = today.getSeconds();
if (intHours == 0) {
hours = "12:";
xfile = "午夜 ";
} else if (intHours < 12) {
hours = intHours+":";
xfile = "上午 ";
} else if (intHours == 12) {
hours = "12:";
xfile = "正午 ";
} else {
intHours = intHours - 12
hours = intHours + ":";
xfile = "下午 ";
}
if (intMinutes < 10) {
minutes = "0"+intMinutes+":";
} else {
minutes = intMinutes+":";
}
if (intSeconds < 10) {
seconds = "0"+intSeconds+" ";
} else {
seconds = intSeconds+" ";
}
timeString = xfile+hours+minutes+seconds;
document.all.Clock.innerHTML = timeString;
window.setTimeout("tick();", 100);
}
//-->
</script>
</head>
<body onLoad="Defaults();tick()">
<table width="170" border="1" cellspacing="0" cellpadding="0">
<form name="when">
<tr>
<td align="center">
<div id=NavBar style="position:relative;top:-1px;">
<select name="month" onChange="On_Month()">
<script language="JavaScript1.2">
<!--
if (document.all){
for (j=0;j<Month_Label.length;j++) {
document.writeln('<option value=' + j + '>' + Month_Label[j]);
}
}
//-->
</script>
</select>
<input type="text" name="year" size=4 maxlength=4 onKeyPress="return Check_Nums()" onKeyUp="On_Year()"><br>
<div id="Clock" style="position:relative;top:-2px;"></div>
</div>
<div id=Calendar style="position:relative;top:-3px;"></div>
<input type="button" value=" 上月 " onClick="Skip('-')">
<input type="button" value=" 下月 " onClick="Skip('+')">
</td>
</tr>
</form>
</table>
</body>
</html>
//由于笔者时间上的缘故所有效果的预览交由读者自己放入网页查试,谢谢. |