例子二
[html]
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Language" content="zh-cn">
<style>
<!--
td, input { font-family: Tahoma; font-size: 8pt; color: #000080 }
-->
</style>
</head>
<!--第1部分完成对一个文本框和一个隐藏的div层的生成,已经相关的CSS等等-->
<!--↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 第1部分 ↓↓↓↓↓↓↓↓↓↓↓↓↓↓-->
<!--在页面上显示一个文本输入框,放置一个onclick事件-->
<body bgcolor="#D6D3CE">
<div align="center">
<center>
<table width="248" border="0">
<tr>
<!--在这里,fPopCalendar(regdate,regdate)的两个参数实际上把整个regdate
(文本框)对象带过去了-->
<td nowrap width="599">选择时间:<input class="input" onClick="fP
opCalendar(regdate,regdate);return false" type="text" name="regdate"
size="12">
</td>
</tr>
</table>
</center>
</div>
<script>
//定义一些变量
var gdCtrl = new Object();
var goSelectTag = new Array();
var gcGray = "#808080";
var gcToggle = "#FB8664";
var gcBG = "#e5e6ec";
var previousObject = null;
var gdCurDate = new Date();
var giYear = gdCurDate.getFullYear();
var giMonth = gdCurDate.getMonth()+1;
var giDay = gdCurDate.getDate();
var gMonths = new Array("一月","二月","三月","四月","五月","六月","七月","八月"
,"九月","十月","十一月","十二月");
//显示一个隐藏的层,放置日期的选择框。
with (document) {
write("<Div id=VicPopCal style=POSITION:absolute;VISIBILITY:hidden;border:
2px ridge;z-index:100;>");
write("<table border=0 bgcolor=#cccccc>");
write("<TR>");
write("<td valign=middle align=center><input type=button name=PrevMonth
value=< style=height:20;width:20;FONT:bold onClick=fPrevMonth()>");
write(" <Select name=tbSelYear onChange=fUpdateCal(tbSelYear.value, tbSelMonth.value) Victor=Won>");
for(i=1950;i<2015;i++)
write("<OPTION value="+i+">"+i+" 年</OPTION>");
write("</Select>");
write(" <select name=tbSelMonth onChange=fUpdateCal(tbSelYear.value, tbSelMonth.value) Victor=Won>");
for (i=0; i<12; i++)
write("<option value="+(i+1)+">"+gMonths[i]+"</option>");
write("</Select>");
write(" <input type=button name=PrevMonth value=> style=height:20;
width:20;FONT:bold onclick=fNextMonth()>");
write("</td>");
write("</TR><TR>");
write("<td align=center>");
write("<DIV style=background-color:teal><table width=100%
border=0>");
//fDrawCal()函数完成日期的显示。fDrawCal()函数有4个参数,第1个表示显示的
年份,第2个参数表示显示的月份,第3个参数表示
//显示的格子的高度,最后一个参数应该是字体宽度,但是似乎不起作用。
fDrawCal(giYear, giMonth, 20, 12);
function fDrawCal(iYear, iMonth, iCellHeight, sDateTextSize) {
//建立WeekDay数组。
var WeekDay = new Array("日","一","二","三","四","五","六");
//建立styleTD,就是每一个TD的style。
var styleTD = " bgcolor="+gcBG+" bordercolor="+gcBG+" valign=
middle align=center height="+iCellHeight+" style=font:bold arial
"+sDateTextSize+";";
with (document) {
write("<tr>");
//这个for完成星期的显示。
for(i=0; i<7; i++){
write("<td "+styleTD+"color:maroon >"+ WeekDay[i] + "</td>");
}
write("</tr>");
//在这里,每个格子(6行7列)的显示内容暂时都是空的,要由后面的fUpdateCal()
函数完成。
for (w = 1; w < 7; w++) {
write("<tr>");
for (d = 0; d < 7; d++) {
write("<td id=calCell "+styleTD+"cursor:hand; onMouseOver=this.bgColor=
gcToggle onMouseOut=this.bgColor=gcBG onclick=fSetSelected(this)>");
write("<font id=cellText Victor=Hcy_Flag> </font>");
write("</td>")
}
write("</tr>");
}
}
}
write("</table></DIV>");
write("</td>");
write("</TR><TR><TD align=center>");
write("<TABLE width=100%><TR><TD align=center>");
write("<B style=cursor:hand onclick=fSetDate(0,0,0) onMouseOver=this.style.color=gcToggle onMouseOut=this.style
.color=0>清空</B>");
write("</td><td algin=center>");
write("<B style=cursor:hand onclick=fSetDate(giYear,giMonth,giDay) onMouseOver=this.style.color=gcToggle onMouse
Out=this.style.color=0>今天: "+giYear+"-"+giMonth+"-"+giDay+"</B>");
write("</td></tr></table>");
write("</TD></TR>");
write("</TABLE></Div>");
}
//↑↑↑↑↑↑↑↑↑↑↑↑↑↑ 第1部分 ↑↑↑↑↑↑↑↑↑↑↑↑↑↑