一个绝对简单易用的日期控件,纯javascript实现[启天论坛]

偶也来一个..呵呵```

<html>
<head>
<title>日历程序</title>
<style>
td {font-family: Tahoma, Verdana, sans-serif; font-size: 12px;}
a:link, a:visited { text-decoration: none; color : #FFFFFF; }
a:hover { color: #FF9900; position: relative; top: 1px }
a:active { color: #FF0000; }
</style>
<script language="JavaScript">

// months as they appear in the calendar's title
var ARR_MONTHS = ["一月", "二月", "三月", "四月", "五月", "六月","七月", "八月", "九月", "十月", "十一月", "十二月"];
// week day titles as they appear on the calendar
var ARR_WEEKDAYS = ["日", "一", "二", "三", "四", "五", "六"];
// day week starts from (normally 0-Su or 1-Mo)
var NUM_WEEKSTART = 0;
// path to the directory where calendar images are stored. trailing slash req.
var STR_ICONPATH = 'images/';

var re_url = new RegExp('datetime=(\\-?\\d+)');
var dt_current = (re_url.exec(String(window.location)) ? new Date(new Number(RegExp.$1)) : new Date());
var today = new Date();

// get same date in the previous year
var dt_prev_year = new Date(dt_current);
dt_prev_year.setFullYear(dt_prev_year.getFullYear() - 1);
if (dt_prev_year.getDate() != dt_current.getDate())
dt_prev_year.setDate(0);

// get same date in the next year
var dt_next_year = new Date(dt_current);
dt_next_year.setFullYear(dt_next_year.getFullYear() + 1);
if (dt_next_year.getDate() != dt_current.getDate())
dt_next_year.setDate(0);

// get same date in the previous month
var dt_prev_month = new Date(dt_current);
dt_prev_month.setMonth(dt_prev_month.getMonth() - 1);
if (dt_prev_month.getDate() != dt_current.getDate())
dt_prev_month.setDate(0);

// get same date in the next month
var dt_next_month = new Date(dt_current);
dt_next_month.setMonth(dt_next_month.getMonth() + 1);
if (dt_next_month.getDate() != dt_current.getDate())
dt_next_month.setDate(0);

// get first day to display in the grid for current month
var dt_firstday = new Date(dt_current);
dt_firstday.setDate(1);
dt_firstday.setDate(1 - (7 + dt_firstday.getDay() - NUM_WEEKSTART) % 7);

function changeDateTime(curTime) {
var old_url = window.location.href;
old_url = old_url.substr(0, old_url.indexOf('?'));
var new_url = old_url+'?datetime='+curTime;
window.location = new_url;
}

</script>
</head>
<body bgcolor="#FFFFFF" marginheight="5" marginwidth="5" topmargin="5" leftmargin="5">
<table class="clsOTable" cellspacing="0" border="0" width="200">
<tr><td bgcolor="#4682B4">
<table cellspacing="1" cellpadding="3" border="0" width="100%">
<tr><td colspan="7"><table cellspacing="0" cellpadding="0" border="0" width="100%">
<tr>
<script language="JavaScript">
document.write(
'<td><a href="javascript:changeDateTime(' + dt_prev_year.valueOf() + ')" title="previous year"><font face="Webdings" color="FFFFFF">9</font></a> <a href="javascript:changeDateTime(' + dt_prev_month.valueOf() + ')" title="previous month"><font face="Webdings" color="FFFFFF">7</font></a></td>' +
'<td align="center" width="100%"><font color="#ffffff">' + ARR_MONTHS[dt_current.getMonth()] + ' ' + dt_current.getFullYear() + '</font></td>' +
'<td><a href="javascript:changeDateTime(' + dt_next_month.valueOf() + ')" title="next month"><font face="Webdings" color="FFFFFF">8</font></a> <a href="javascript:changeDateTime(' + dt_next_year.valueOf() + ')" title="next year"><font face="Webdings" color="FFFFFF">:</font></a></td>'
);
</script>
</tr>
</table></td></tr>
<tr>
<script language="JavaScript">

// print weekdays titles
for (var n=0; n<7; n++)
document.write('<td bgcolor="#87cefa" align="center"><font color="#ffffff">'+ARR_WEEKDAYS[(NUM_WEEKSTART+n)%7]+'</font></td>');
document.write('</tr>');

// print calendar table
var dt_current_day = new Date(dt_firstday);
while (dt_current_day.getMonth() == dt_current.getMonth() ||
dt_current_day.getMonth() == dt_firstday.getMonth()) {
// print row heder
document.write('<tr>');
for (var n_current_wday=0; n_current_wday<7; n_current_wday++) {
if (dt_current_day.getDate() == today.getDate() &&
dt_current_day.getMonth() == today.getMonth() &&
dt_current_day.getYear() == today.getYear())
// print current date
str = '<td bgcolor="#ffb6c1" align="center" width="14%">';
else if (dt_current_day.getDay() == 0 || dt_current_day.getDay() == 6)
// weekend days
str = '<td bgcolor="#dbeaf5" align="center" width="14%">';
else
// print working days of current month
str = '<td bgcolor="#ffffff" align="center" width="14%">';

if (dt_current_day.getMonth() == this.dt_current.getMonth())
// print days of current month
str += '<font color="#000000">';
else
// print days of other months
str += '<font color="#606060">';

str += dt_current_day.getDate()+'</font>';
str += '</td>';
document.write(str);
dt_current_day.setDate(dt_current_day.getDate()+1);
}
// print row footer
document.write('</tr>');
}
</script>
</table></tr></td>
</table>
</body>
</html>

主题：一个绝对简单易用的日期控件,纯javascript实现