<html>
<head>
<meta http
equiv="Content
Type" content="text/html; charset=gb
">
<title>網頁特效|Linkweb
cn/Js|
日歷生成器</title>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript">
<!
Begin
var dDate = new Date();
var dCurMonth = dDate
getMonth();
var dCurDayOfMonth = dDate
getDate();
var dCurYear = dDate
getFullYear();
var objPrevElement = new Object();
function fToggleColor(myElement) {
var toggleColor = "#ff
";
if (myElement
id == "calDateText") {
if (myElement
color == toggleColor) {
myElement
color = "";
} else {
myElement
color = toggleColor;
}
} else if (myElement
id == "calCell") {
for (var i in myElement
children) {
if (myElement
children[i]
id == "calDateText") {
if (myElement
children[i]
color == toggleColor) {
myElement
children[i]
color = "";
} else {
myElement
children[i]
color = toggleColor;
}
}
}
}
}
function fSetSelectedDay(myElement){
if (myElement
id == "calCell") {
if (!isNaN(parseInt(myElement
children["calDateText"]
innerText))) {
myElement
bgColor = "#c
c
c
";
objPrevElement
bgColor = "";
document
all
calSelectedDate
value = parseInt(myElement
children["calDateText"]
innerText);
objPrevElement = myElement;
}
}
}
function fGetDaysInMonth(iMonth
iYear) {
var dPrevDate = new Date(iYear
iMonth
);
return dPrevDate
getDate();
}
function fBuildCal(iYear
iMonth
iDayStyle) {
var aMonth = new Array();
aMonth[
] = new Array(
);
aMonth[
] = new Array(
);
aMonth[
] = new Array(
);
aMonth[
] = new Array(
);
aMonth[
] = new Array(
);
aMonth[
] = new Array(
);
aMonth[
] = new Array(
);
var dCalDate = new Date(iYear
iMonth
);
var iDayOfFirst = dCalDate
getDay();
var iDaysInMonth = fGetDaysInMonth(iMonth
iYear);
var iVarDate =
;
var i
d
w;
if (iDayStyle ==
) {
aMonth[
][
] = "Sunday";
aMonth[
][
] = "Monday";
aMonth[
][
] = "Tuesday";
aMonth[
][
] = "Wednesday";
aMonth[
][
] = "Thursday";
aMonth[
][
] = "Friday";
aMonth[
][
] = "Saturday";
} else if (iDayStyle ==
) {
aMonth[
][
] = "Sun";
aMonth[
][
] = "Mon";
aMonth[
][
] = "Tue";
aMonth[
][
] = "Wed";
aMonth[
][
] = "Thu";
aMonth[
][
] = "Fri";
aMonth[
][
] = "Sat";
} else {
aMonth[
][
] = "Su";
aMonth[
][
] = "Mo";
aMonth[
][
] = "Tu";
aMonth[
][
] = "We";
aMonth[
][
] = "Th";
aMonth[
][
] = "Fr";
aMonth[
][
] = "Sa";
}
for (d = iDayOfFirst; d <
; d++) {
aMonth[
][d] = iVarDate;
iVarDate++;
}
for (w =
; w <
; w++) {
for (d =
; d <
; d++) {
if (iVarDate <= iDaysInMonth) {
aMonth[w][d] = iVarDate;
iVarDate++;
}
}
}
return aMonth;
}
function fDrawCal(iYear
iMonth
iCellWidth
iCellHeight
sDateTextSize
sDateTextWeight
iDayStyle) {
var myMonth;
myMonth = fBuildCal(iYear
iMonth
iDayStyle);
document
write("<table border=
>")
document
write("<tr>");
document
write("<td align=
center
style=
FONT
FAMILY:Arial;FONT
SIZE:
px;FONT
WEIGHT: bold
>" + myMonth[
][
] + "</td>");
document
write("<td align=
center
style=
FONT
FAMILY:Arial;FONT
SIZE:
px;FONT
WEIGHT: bold
>" + myMonth[
][
] + "</td>");
document
write("<td align=
center
style=
FONT
FAMILY:Arial;FONT
SIZE:
px;FONT
WEIGHT: bold
>" + myMonth[
][
] + "</td>");
document
write("<td align=
center
style=
FONT
FAMILY:Arial;FONT
SIZE:
px;FONT
WEIGHT: bold
>" + myMonth[
][
] + "</td>");
document
write("<td align=
center
style=
FONT
FAMILY:Arial;FONT
SIZE:
px;FONT
WEIGHT: bold
>" + myMonth[
][
] + "</td>");
document
write("<td align=
center
style=
FONT
FAMILY:Arial;FONT
SIZE:
px;FONT
WEIGHT: bold
>" + myMonth[
][
] + "</td>");
document
write("<td align=
center
style=
FONT
FAMILY:Arial;FONT
SIZE:
px;FONT
WEIGHT: bold
>" + myMonth[
][
] + "</td>");
document
write("</tr>");
for (w =
; w <
; w++) {
document
write("<tr>")
for (d =
; d <
; d++) {
document
write("<td align=
left
valign=
top
width=
" + iCellWidth + "
height=
" + iCellHeight + "
id=calCell style=
CURSOR:Hand
onMouseOver=
fToggleColor(this)
onMouseOut=
fToggleColor(this)
onclick=fSetSelectedDay(this)>");
if (!isNaN(myMonth[w][d])) {
document
write("<font id=calDateText onMouseOver=
fToggleColor(this)
style=
CURSOR:Hand;FONT
FAMILY:Arial;FONT
SIZE:" + sDateTextSize + ";FONT
WEIGHT:" + sDateTextWeight + "
onMouseOut=
fToggleColor(this)
onclick=fSetSelectedDay(this)>" + myMonth[w][d] + "</font>");
} else {
document
write("<font id=calDateText onMouseOver=
fToggleColor(this)
style=
CURSOR:Hand;FONT
FAMILY:Arial;FONT
SIZE:" + sDateTextSize + ";FONT
WEIGHT:" + sDateTextWeight + "
onMouseOut=
fToggleColor(this)
onclick=fSetSelectedDay(this)> </font>");
}
document
write("</td>")
}
document
write("</tr>");
}
document
write("</table>")
}
function fUpdateCal(iYear
iMonth) {
myMonth = fBuildCal(iYear
iMonth);
objPrevElement
bgColor = "";
document
all
calSelectedDate
value = "";
for (w =
; w <
; w++) {
for (d =
; d <
; d++) {
if (!isNaN(myMonth[w][d])) {
calDateText[((
*w)+d)
]
innerText = myMonth[w][d];
} else {
calDateText[((
*w)+d)
]
innerText = " ";
}
}
}
}
// End
>
</script>
第二步:把如下代碼加入<body>區域中:
<script language="JavaScript" for=window event=onload>
<!
Begin
var dCurDate = new Date();
frmCalendarSample
tbSelMonth
options[dCurDate
getMonth()]
selected = true;
for (i =
; i < frmCalendarSample
tbSelYear
length; i++)
if (frmCalendarSample
tbSelYear
options[i]
value == dCurDate
getFullYear())
frmCalendarSample
tbSelYear
options[i]
selected = true;
// End
>
</script>
<form name="frmCalendarSample" method="post" action="">
<input type="hidden" name="calSelectedDate" value="">
<table border="
">
<tr>
<td>
<select name="tbSelMonth" onchange=
fUpdateCal(frmCalendarSample
tbSelYear
value
frmCalendarSample
tbSelMonth
value)
>
<option value="
">January</option>
<option value="
">February</option>
<option value="
">March</option>
<option value="
">April</option>
<option value="
">May</option>
<option value="
">June</option>
<option value="
">July</option>
<option value="
">August</option>
<option value="
">September</option>
<option value="
">October</option>
<option value="
">November</option>
<option value="
">December</option>
</select>
<select name="tbSelYear" onchange=
fUpdateCal(frmCalendarSample
tbSelYear
value
frmCalendarSample
tbSelMonth
value)
>
<option value="
">
</option>
<option value="
">
</option>
<option value="
">
</option>
<option value="
">
</option>
<option value="
">
</option>
<option value="
">
</option>
<option value="
">
</option>
</select>
</td>
</tr>
<tr>
<td>
<script language="JavaScript">
var dCurDate = new Date();
fDrawCal(dCurDate
getFullYear()
dCurDate
getMonth()+
"
px"
"bold"
);
</script>
</td>
</tr>
</table>
</form>
From:http://tw.wingwit.com/Article/program/Java/JSP/201311/20433.html