Javascript之日历

<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Javascript日历</title> 
<table cellpadding="0" cellspacing="0" id="1"> 
<tr> 
<td> 
<style> 
body,td,.p1,.p2,.i{font-family:arial} body{margin:6px 0 0 0;background-color:#fff;color:#000;} 
table{border:0} #cal{width:434px;border:1px solid #c3d9ff;font-size:12px;margin:8px 
0 0 15px} #cal #top{height:29px;line-height:29px;background:#e7eef8;color:#003784;padding-left:70px} 
#cal #top select{font-size:12px} #cal #top input{padding:0} #cal ul#wk{margin:0;padding:0;height:25px} 
#cal ul#wk li{float:left;width:60px;text-align:center;line-height:25px;list-style:none} 
#cal ul#wk li b{font-weight:normal;color:#c60b02} #cal #cm{clear:left;border-top:1px 
solid #ddd;border-bottom:1px dotted #ddd;position:relative} #cal #cm .cell{position:absolute;width:42px;height:36px;text-align:center;margin:0 
0 0 9px} #cal #cm .cell .so{font:bold 16px arial;} #cal #bm{text-align:right;height:24px;line-height:24px;padding:0 
13px 0 0} #cal #bm a{color:7977ce} #cal #fd{display:none;position:absolute;border:1px 
solid #dddddf;background:#feffcd;padding:10px;line-height:21px;width:150px} 
#cal #fd b{font-weight:normal;color:#c60a00} 
</style> 
<!--[if IE]> 
<style> 
#cal #top{padding-top:4px} #cal #top input{width:65px} #cal #fd{width:170px} 
</style> 
<![endif]--> 
<div id="cal"> 
<div id="top"> 
公元 
<select> 
</select> 
年 
<select> 
</select> 
月 农历 
<span> 
</span> 
年 [ 
<span> 
</span> 
年 ] 
<input type="button" value="回到今天" title="点击后跳转回今天" style="padding:0px"> 
</div> 
<ul id="wk"> 
<li> 
一 
</li> 
<li> 
二 
</li> 
<li> 
三 
</li> 
<li> 
四 
</li> 
<li> 
五 
</li> 
<li> 
<b> 
六 
</b> 
</li> 
<li> 
<b> 
日 
</b> 
</li> 
</ul> 
<div id="cm"> 
</div> 
<div id="bm"> 
</div> 
</div> 
</td> 
</tr> 
</table> 
<script type="text/javascript"> 
(function() { 
var S = navigator.userAgent.indexOf("MSIE") != -1 && !window.opera; 
function M(C) { 
return document.getElementById(C) 
} 
function R(C) { 
return document.createElement(C) 
} 
var P = [19416, 19168, 42352, 21717, 53856, 55632, 91476, 22176, 39632, 21970, 19168, 42422, 42192, 53840, 119381, 46400, 54944, 44450, 38320, 84343, 18800, 42160, 46261, 27216, 27968, 109396, 11104, 38256, 21234, 18800, 25958, 54432, 59984, 28309, 23248, 11104, 100067, 37600, 116951, 51536, 54432, 120998, 46416, 22176, 107956, 9680, 37584, 53938, 43344, 46423, 27808, 46416, 86869, 19872, 42448, 83315, 21200, 43432, 59728, 27296, 44710, 43856, 19296, 43748, 42352, 21088, 62051, 55632, 23383, 22176, 38608, 19925, 19152, 42192, 54484, 53840, 54616, 46400, 46496, 103846, 38320, 18864, 43380, 42160, 45690, 27216, 27968, 44870, 43872, 38256, 19189, 18800, 25776, 29859, 59984, 27480, 21952, 43872, 38613, 37600, 51552, 55636, 54432, 55888, 30034, 22176, 43959, 9680, 37584, 51893, 43344, 46240, 47780, 44368, 21977, 19360, 42416, 86390, 21168, 43312, 31060, 27296, 44368, 23378, 19296, 42726, 42208, 53856, 60005, 54576, 23200, 30371, 38608, 19415, 19152, 42192, 118966, 53840, 54560, 56645, 46496, 22224, 21938, 18864, 42359, 42160, 43600, 111189, 27936, 44448]; 
var K = "甲乙丙丁戊己庚辛壬癸"; 
var J = "子丑寅卯辰巳午未申酉戌亥"; 
var O = "鼠牛虎兔龙蛇马羊猴鸡狗猪"; 
var L = ["小寒", "大寒", "立春", "雨水", "惊蛰", "春分", "清明", "谷雨", "立夏", "小满", "芒种", "夏至", "小暑", "大暑", "立秋", "处暑", "白露", "秋分", "寒露", "霜降", "立冬", "小雪", "大雪", "冬至"]; 
var D = [0, 21208, 43467, 63836, 85337, 107014, 128867, 150921, 173149, 195551, 218072, 240693, 263343, 285989, 308563, 331033, 353350, 375494, 397447, 419210, 440795, 462224, 483532, 504758]; 
var B = "日一二三四五六七八九十"; 
var H = ["正", "二", "三", "四", "五", "六", "七", "八", "九", "十", "十一", "腊"]; 
var E = "初十廿卅"; 
var V = { 
"0101": "*1元旦节", 
"0214": "情人节", 
"0305": "学雷锋纪念日", 
"0308": "妇女节", 
"0312": "植树节", 
"0315": "消费者权益日", 
"0401": "愚人节", 
"0501": "*1劳动节", 
"0504": "青年节", 
"0601": "国际儿童节", 
"0701": "中共党诞辰", 
"0801": "建军节", 
"0910": "中国教师节", 
"1001": "*3国庆节", 
"1224": "平安夜", 
"1225": "圣诞节" 
}; 
var T = { 
"0101": "*2春节", 
"0115": "元宵节", 
"0505": "*1端午节", 
"0815": "*1中秋节", 
"0909": "重阳节", 
"1208": "腊八节", 
"0100": "除夕" 
}; 
function U(Y) { 
function c(j, i) { 
var h = new Date((31556925974.7 * (j - 1900) + D[i] * 60000) + Date.UTC(1900, 0, 6, 2, 5)); 
return (h.getUTCDate()) 
} 
function d(k) { 
var h, j = 348; 
for (h = 32768; h > 8; h >>= 1) { 
j += (P[k - 1900] & h) ? 1 : 0 
} 
return (j + b(k)) 
} 
function a(h) { 
return (K.charAt(h % 10) + J.charAt(h % 12)) 
} 
function b(h) { 
if (g(h)) { 
return ((P[h - 1900] & 65536) ? 30 : 29) 
} else { 
return (0) 
} 
} 
function g(h) { 
return (P[h - 1900] & 15) 
} 
function e(i, h) { 
return ((P[i - 1900] & (65536 >> h)) ? 30 : 29) 
} 
function C(m) { 
var k, j = 0, 
h = 0; 
var l = new Date(1900, 0, 31); 
var n = (m - l) / 86400000; 
this.dayCyl = n + 40; 
this.monCyl = 14; 
for (k = 1900; k < 2050 && n > 0; k++) { 
h = d(k); 
n -= h; 
this.monCyl += 12 
} 
if (n < 0) { 
n += h; 
k--; 
this.monCyl -= 12 
} 
this.year = k; 
this.yearCyl = k - 1864; 
j = g(k); 
this.isLeap = false; 
for (k = 1; k < 13 && n > 0; k++) { 
if (j > 0 && k == (j + 1) && this.isLeap == false) {--k; 
this.isLeap = true; 
h = b(this.year) 
} else { 
h = e(this.year, k) 
} 
if (this.isLeap == true && k == (j + 1)) { 
this.isLeap = false 
} 
n -= h; 
if (this.isLeap == false) { 
this.monCyl++ 
} 
} 
if (n == 0 && j > 0 && k == j + 1) { 
if (this.isLeap) { 
this.isLeap = false 
} else { 
this.isLeap = true; --k; --this.monCyl 
} 
} 
if (n < 0) { 
n += h; --k; --this.monCyl 
} 
this.month = k; 
this.day = n + 1 
} 
function G(h) { 
return h < 10 ? "0" + h: h 
} 
function f(i, j) { 
var h = i; 
return j.replace(/dd?d?d?|MM?M?M?|yy?y?y?/g, 
function(k) { 
switch (k) { 
case "yyyy": 
var l = "000" + h.getFullYear(); 
return l.substring(l.length - 4); 
case "dd": 
return G(h.getDate()); 
case "d": 
return h.getDate().toString(); 
case "MM": 
return G((h.getMonth() + 1)); 
case "M": 
return h.getMonth() + 1 
} 
}) 
} 
function Z(i, h) { 
var j; 
switch (i, h) { 
case 10: 
j = "初十"; 
break; 
case 20: 
j = "二十"; 
break; 
case 30: 
j = "三十"; 
break; 
default: 
j = E.charAt(Math.floor(h / 10)); 
j += B.charAt(h % 10) 
} 
return (j) 
} 
this.date = Y; 
this.isToday = false; 
this.isRestDay = false; 
this.solarYear = f(Y, "yyyy"); 
this.solarMonth = f(Y, "M"); 
this.solarDate = f(Y, "d"); 
this.solarWeekDay = Y.getDay(); 
this.solarWeekDayInChinese = "星期" + B.charAt(this.solarWeekDay); 
var X = new C(Y); 
this.lunarYear = X.year; 
this.shengxiao = O.charAt((this.lunarYear - 4) % 12); 
this.lunarMonth = X.month; 
this.lunarIsLeapMonth = X.isLeap; 
this.lunarMonthInChinese = this.lunarIsLeapMonth ? "闰" + H[X.month - 1] : H[X.month - 1]; 
this.lunarDate = X.day; 
this.showInLunar = this.lunarDateInChinese = Z(this.lunarMonth, this.lunarDate); 
if (this.lunarDate == 1) { 
this.showInLunar = this.lunarMonthInChinese + "月" 
} 
this.ganzhiYear = a(X.yearCyl); 
this.ganzhiMonth = a(X.monCyl); 
this.ganzhiDate = a(X.dayCyl++); 
this.jieqi = ""; 
this.restDays = 0; 
if (c(this.solarYear, (this.solarMonth - 1) * 2) == f(Y, "d")) { 
this.showInLunar = this.jieqi = L[(this.solarMonth - 1) * 2] 
} 
if (c(this.solarYear, (this.solarMonth - 1) * 2 + 1) == f(Y, "d")) { 
this.showInLunar = this.jieqi = L[(this.solarMonth - 1) * 2 + 1] 
} 
if (this.showInLunar == "清明") { 
this.showInLunar = "清明节"; 
this.restDays = 1 
} 
this.solarFestival = V[f(Y, "MM") + f(Y, "dd")]; 
if (typeof this.solarFestival == "undefined") { 
this.solarFestival = "" 
} else { 
if (/\*(\d)/.test(this.solarFestival)) { 
this.restDays = parseInt(RegExp.$1); 
this.solarFestival = this.solarFestival.replace(/\*\d/, "") 
} 
} 
this.showInLunar = (this.solarFestival == "") ? this.showInLunar: this.solarFestival; 
this.lunarFestival = T[this.lunarIsLeapMonth ? "00": G(this.lunarMonth) + G(this.lunarDate)]; 
if (typeof this.lunarFestival == "undefined") { 
this.lunarFestival = "" 
} else { 
if (/\*(\d)/.test(this.lunarFestival)) { 
this.restDays = (this.restDays > parseInt(RegExp.$1)) ? this.restDays: parseInt(RegExp.$1); 
this.lunarFestival = this.lunarFestival.replace(/\*\d/, "") 
} 
} 
if (this.lunarMonth == 12 && this.lunarDate == e(this.lunarYear, 12)) { 
this.lunarFestival = T["0100"]; 
this.restDays = 1 
} 
this.showInLunar = (this.lunarFestival == "") ? this.showInLunar: this.lunarFestival; 
this.showInLunar = (this.showInLunar.length > 4) ? this.showInLunar.substr(0, 2) + "...": this.showInLunar 
} 
var Q = (function() { 
var X = {}; 
X.lines = 0; 
X.dateArray = new Array(42); 
function Y(a) { 
return (((a % 4 === 0) && (a % 100 !== 0)) || (a % 400 === 0)) 
} 
function G(a, b) { 
return [31, (Y(a) ? 29 : 28), 31, 30, 31, 30, 31, 31, 30, 31, 30, 31][b] 
} 
function C(a, b) { 
a.setDate(a.getDate() + b); 
return a 
} 
function Z(a) { 
var f = 0; 
var c = new U(new Date(a.solarYear, a.solarMonth - 1, 1)); 
var d = (c.solarWeekDay - 1 == -1) ? 6 : c.solarWeekDay - 1; 
X.lines = Math.ceil((d + G(a.solarYear, a.solarMonth - 1)) / 7); 
for (var e = 0; e < X.dateArray.length; e++) { 
if (c.restDays != 0) { 
f = c.restDays 
} 
if (f > 0) { 
c.isRest = true 
} 
if (d-->0 || c.solarMonth != a.solarMonth) { 
X.dateArray[e] = null; 
continue 
} 
var b = new U(new Date()); 
if (c.solarYear == b.solarYear && c.solarMonth == b.solarMonth && c.solarDate == b.solarDate) { 
c.isToday = true 
} 
X.dateArray[e] = c; 
c = new U(C(c.date, 1)); 
f-- 
} 
} 
return { 
init: function(a) { 
Z(a) 
}, 
getJson: function() { 
return X 
} 
} 
})(); 
var W = (function() { 
var C = M("top").getElementsByTagName("SELECT")[0]; 
var X = M("top").getElementsByTagName("SELECT")[1]; 
var G = M("top").getElementsByTagName("SPAN")[0]; 
var c = M("top").getElementsByTagName("SPAN")[1]; 
var Y = M("top").getElementsByTagName("INPUT")[0]; 
function a(g) { 
G.innerHTML = g.ganzhiYear; 
c.innerHTML = g.shengxiao 
} 
function b(g) { 
C[g.solarYear - 1901].selected = true; 
X[g.solarMonth - 1].selected = true 
} 
function f() { 
var j = C.value; 
var g = X.value; 
var i = new U(new Date(j, g - 1, 1)); 
Q.init(i); 
N.draw(); 
if (this == C) { 
i = new U(new Date(j, 3, 1)); 
G.innerHTML = i.ganzhiYear; 
c.innerHTML = i.shengxiao 
} 
var h = new U(new Date()); 
Y.style.visibility = (j == h.solarYear && g == h.solarMonth) ? "hidden": "visible" 
} 
function Z() { 
var g = new U(new Date()); 
a(g); 
b(g); 
Q.init(g); 
N.draw(); 
Y.style.visibility = "hidden" 
} 
function d(k, g) { 
for (var j = 1901; j < 2050; j++) { 
var h = R("OPTION"); 
h.value = j; 
h.innerHTML = j; 
if (j == k) { 
h.selected = "selected" 
} 
C.appendChild(h) 
} 
for (var j = 1; j < 13; j++) { 
var h = R("OPTION"); 
h.value = j; 
h.innerHTML = j; 
if (j == g) { 
h.selected = "selected" 
} 
X.appendChild(h) 
} 
C.onchange = f; 
X.onchange = f 
} 
function e(g) { 
d(g.solarYear, g.solarMonth); 
G.innerHTML = g.ganzhiYear; 
c.innerHTML = g.shengxiao; 
Y.onclick = Z; 
Y.style.visibility = "hidden" 
} 
return { 
init: function(g) { 
e(g) 
}, 
reset: function(g) { 
b(g) 
} 
} 
})(); 
var N = (function() { 
function C() { 
var Z = Q.getJson(); 
var c = Z.dateArray; 
M("cm").style.height = Z.lines * 38 + 2 + "px"; 
M("cm").innerHTML = ""; 
for (var a = 0; a < c.length; a++) { 
if (c[a] == null) { 
continue 
} 
var X = R("DIV"); 
if (c[a].isToday) { 
X.style.border = "1px solid #a5b9da"; 
X.style.background = "#c1d9ff" 
} 
X.className = "cell"; 
X.style.left = (a % 7) * 60 + "px"; 
X.style.top = Math.floor(a / 7) * 38 + 2 + "px"; 
var b = R("DIV"); 
b.className = "so"; 
// http://www.codefans.net 
b.style.color = ((a % 7) > 4 || c[a].isRest) ? "#c60b02": "#313131"; 
b.innerHTML = c[a].solarDate; 
X.appendChild(b); 
var Y = R("DIV"); 
Y.style.color = "#666"; 
Y.innerHTML = c[a].showInLunar; 
X.appendChild(Y); 
X.onmouseover = (function(d) { 
return function(f) { 
F.show({ 
dateIndex: d, 
cell: this 
}) 
} 
})(a); 
X.onmouseout = function() { 
F.hide() 
}; 
X.onmouseup = function() { 
//alert(‘a‘);
}; 
M("cm").appendChild(X) 
} 
var G = R("DIV"); 
G.id = "fd"; 
M("cm").appendChild(G); 
F.init(G) 
} 
return { 
draw: function(G) { 
C(G) 
} 
} 
})(); 
var F = (function() { 
var C; 
function Y(e, c) { 
if (arguments.length > 1) { 
var b = /([.*+?^=!:${}()|[\]\/\\])/g, 
Z = "{".replace(b, "\\$1"), 
d = "}".replace(b, "\\$1"); 
var a = new RegExp("#" + Z + "([^" + Z + d + "]+)" + d, "g"); 
if (typeof(c) == "object") { 
return e.replace(a, 
function(f, h) { 
var g = c[h]; 
return typeof(g) == "undefined" ? "": g 
}) 
} 
} 
return e 
} 
function G(b) { 
var a = Q.getJson().dateArray[b.dateIndex]; 
var Z = b.cell; 
var c = "#{solarYear} 年 #{solarMonth} 月 #{solarDate} 日 #{solarWeekDayInChinese}"; 
c += "<br><b>农历 #{lunarMonthInChinese}月#{lunarDateInChinese}</b>"; 
c += "<br>#{ganzhiYear}年 #{ganzhiMonth}月 #{ganzhiDate}日"; 
if (a.solarFestival != "" || a.lunarFestival != "" || a.jieqi != "") { 
c += "<br><b>#{lunarFestival} #{solarFestival} #{jieqi}</b>" 
} 
C.innerHTML = Y(c, a); 
C.style.top = Z.offsetTop + Z.offsetHeight - 5 + "px"; 
C.style.left = Z.offsetLeft + Z.offsetWidth - 5 + "px"; 
C.style.display = "block" 
} 
function X() { 
C.style.display = "none" 
} 
return { 
show: function(Z) { 
G(Z) 
}, 
hide: function() { 
X() 
}, 
init: function(Z) { 
C = Z 
} 
} 
})(); 
var A = new U(new Date()); 
if (S) { 
window.attachEvent("onload", 
function() { 
W.reset(A) 
}) 
} 
W.init(A); 
Q.init(A); 
N.draw(); 
})(); 
</script>