DDR爱好者之家 Design By 杰米
本文实例为大家分享了js实现日历效果的具体代码，供大家参考，具体内容如下
<!doctype html>
<html>
<head>
<meta charset="gb2312">
<title>万年历</title>
<script type="text/javascript">
var lunarInfo = new Array(
0x04bd8, 0x04ae0, 0x0a570, 0x054d5, 0x0d260, 0x0d950, 0x16554, 0x056a0, 0x09ad0, 0x055d2,
0x04ae0, 0x0a5b6, 0x0a4d0, 0x0d250, 0x1d255, 0x0b540, 0x0d6a0, 0x0ada2, 0x095b0, 0x14977,
0x04970, 0x0a4b0, 0x0b4b5, 0x06a50, 0x06d40, 0x1ab54, 0x02b60, 0x09570, 0x052f2, 0x04970,
0x06566, 0x0d4a0, 0x0ea50, 0x06e95, 0x05ad0, 0x02b60, 0x186e3, 0x092e0, 0x1c8d7, 0x0c950,
0x0d4a0, 0x1d8a6, 0x0b550, 0x056a0, 0x1a5b4, 0x025d0, 0x092d0, 0x0d2b2, 0x0a950, 0x0b557,
0x06ca0, 0x0b550, 0x15355, 0x04da0, 0x0a5d0, 0x14573, 0x052d0, 0x0a9a8, 0x0e950, 0x06aa0,
0x0aea6, 0x0ab50, 0x04b60, 0x0aae4, 0x0a570, 0x05260, 0x0f263, 0x0d950, 0x05b57, 0x056a0,
0x096d0, 0x04dd5, 0x04ad0, 0x0a4d0, 0x0d4d4, 0x0d250, 0x0d558, 0x0b540, 0x0b5a0, 0x195a6,
0x095b0, 0x049b0, 0x0a974, 0x0a4b0, 0x0b27a, 0x06a50, 0x06d40, 0x0af46, 0x0ab60, 0x09570,
0x04af5, 0x04970, 0x064b0, 0x074a3, 0x0ea50, 0x06b58, 0x055c0, 0x0ab60, 0x096d5, 0x092e0,
0x0c960, 0x0d954, 0x0d4a0, 0x0da50, 0x07552, 0x056a0, 0x0abb7, 0x025d0, 0x092d0, 0x0cab5,
0x0a950, 0x0b4a0, 0x0baa4, 0x0ad50, 0x055d9, 0x04ba0, 0x0a5b0, 0x15176, 0x052b0, 0x0a930,
0x07954, 0x06aa0, 0x0ad50, 0x05b52, 0x04b60, 0x0a6e6, 0x0a4e0, 0x0d260, 0x0ea65, 0x0d530,
0x05aa0, 0x076a3, 0x096d0, 0x04bd7, 0x04ad0, 0x0a4d0, 0x1d0b6, 0x0d250, 0x0d520, 0x0dd45,
0x0b5a0, 0x056d0, 0x055b2, 0x049b0, 0x0a577, 0x0a4b0, 0x0aa50, 0x1b255, 0x06d20, 0x0ada0)
var solarMonth = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
var Animals = new Array("鼠", "牛", "虎", "兔", "龙", "蛇", "马", "羊", "猴", "鸡", "狗", "猪");
var solarTerm = new Array("小寒", "大寒", "立春", "雨水", "惊蛰", "春分", "清明", "谷雨", "立夏", "小满", "芒种", "夏至", "小暑", "大暑", "立秋", "处暑", "白露", "秋分", "寒露", "霜降", "立冬", "小雪", "大雪", "冬至");
var sTermInfo = new Array(0, 21208, 42467, 63836, 85337, 107014, 128867, 150921, 173149, 195551, 218072, 240693, 263343, 285989, 308563, 331033, 353350, 375494, 397447, 419210, 440795, 462224, 483532, 504758);
var nStr1 = new Array('日', '一', '二', '三', '四', '五', '六', '七', '八', '九', '十');
var nStr2 = new Array('初', '十', '廿', '卅');
//公历节日
var sFtv = new Array(
"0101 元旦",
"0214 情人节",
"0308 妇女节",
"0312 植树节",
"0315 消费者权益日",
"0401 愚人节",
"0501 劳动节",
"0504 青年节",
"0512 护士节",
"0601 儿童节",
"0701 建党节",
"0801 建军节",
"0910 教师节",
"0928 孔子诞辰",
"1001 国庆节",
"1006 老人节",
"1024 联合国日",
"1224 平安夜",
"1225 圣诞节")
//农历节日
var lFtv = new Array(
"0101 春节",
"0115 元宵节",
"0505 端午节",
"0707 七夕情人节",
"0715 中元节",
"0815 中秋节",
"0909 重阳节",
"1208 腊八节",
"1224 小年")
//返回农历y年的总天数
function lYearDays(y) {
var i, sum = 348;
for (i = 0x8000; i > 0x8; i = 1) sum += (lunarInfo[y - 1900] & i) "";
var i, sD, s, size;
cld = new calendar(SY, SM);
GZ.innerHTML = ' 【' + Animals[(SY - 4) % 12] + '】'; //生肖
for (i = 0; i < 42; i++) {
sObj = eval('SD' + i);
lObj = eval('LD' + i);
sObj.className = '';
sD = i - cld.firstWeek;
if (sD > -1 && sD < cld.length) { //日期内
sObj.innerHTML = sD + 1;
if (cld[sD].isToday) { sObj.style.color = '#9900FF'; } //今日颜色
else { sObj.style.color = ''; }
if (cld[sD].lDay == 1) { //显示农历月
lObj.innerHTML = '<b>' + (cld[sD].isLeap "除夕"; Slfw = "除夕"; }
}
}
for (var ipp = 0; ipp < sFtv.length; ipp++) { //公历节日
if (parseInt(sFtv[ipp].substr(0, 2)) == (SM + 1)) {
if (parseInt(sFtv[ipp].substr(2, 4)) == (sD + 1)) {
lObj.innerHTML = sFtv[ipp].substr(5);
Ssfw = sFtv[ipp].substr(5);
}
}
}
if ((SM + 1) == 5) { //母亲节
if (fat == 0) {
if ((sD + 1) == 7) { Ssfw = "母亲节"; lObj.innerHTML = "母亲节" }
}
else if (fat < 9) {
if ((sD + 1) == ((7 - fat) + 8)) { Ssfw = "母亲节"; lObj.innerHTML = "母亲节" }
}
}
if ((SM + 1) == 6) { //父亲节
if (mat == 0) {
if ((sD + 1) == 14) { Ssfw = "父亲节"; lObj.innerHTML = "父亲节" }
}
else if (mat < 9) {
if ((sD + 1) == ((7 - mat) + 15)) { Ssfw = "父亲节"; lObj.innerHTML = "父亲节" }
}
}
if (s.length <= 0) { //设置节气的颜色
s = cld[sD].solarTerms;
if (s.length > 0) s = s.fontcolor('limegreen');
}
if (s.length > 0) { lObj.innerHTML = s; Slfw = s; } //节气
if ((Slfw != null) && (Ssfw != null)) {
lObj.innerHTML = Slfw + "/" + Ssfw;
}
}
else { //非日期
sObj.innerHTML = '';
lObj.innerHTML = '';
}
}
}
//在下拉列表中选择年月时,调用自定义函数drawCld(),显示公历和农历的相关信息
function changeCld() {
var y, m;
y = CLD.SY.selectedIndex + 1900;
m = CLD.SM.selectedIndex;
drawCld(y, m);
}
//用自定义变量保存当前系统中的年月日
var Today = new Date();
var tY = Today.getFullYear();
var tM = Today.getMonth();
var tD = Today.getDate();
//打开页时,在下拉列表中显示当前年月,并调用自定义函数drawCld(),显示公历和农历的相关信息
function initial() {
CLD.SY.selectedIndex = tY - 1900;
CLD.SM.selectedIndex = tM;
drawCld(tY, tM);
}
window.onload = function () {
initial();
}
</script>
<style type="text/css">
table {
font-size: 12px;
table-layout: fixed;
empty-cells: show;
border-collapse: collapse;
margin: 0 auto;
border: 1px solid #cad9ea;
color: #666;
}
td {
height: 30px;
font-family: Arial Black;
}
th {
width: 54px;
font-size: 14px;
background-color: #e0e0e0;
}
td, th {
border: 1px solid #cad9ea;
padding: 6px;
}
tr {
text-align: center;
}
.header {
background-color: #006600;
color: #fff;
font-size: 14px;
text-align: left;
}
.header #GZ {
margin-left: 120px;
}
</style>
</head>
<body>
<form name=CLD>
<table>
<tr class="header">
<td colSpan=7>
公历
<select name=SY onchange=changeCld()>
<script type="text/javascript">
for (i = 1900; i < 2050; i++) document.write('<option>' + i);
</script>
</select>
年
<select name=SM onchange=changeCld()>
<script type="text/javascript">
for (i = 1; i < 13; i++) document.write('<option>' + i);
</script>
</select>
月 <font id=GZ></font>
</td>
</tr>
<tr>
<th>日</th>
<th>一</th>
<th>二</th>
<th>三</th>
<th>四</th>
<th>五</th>
<th>六</th>
</tr>
<script type="text/javascript">
var gNum;
for (i = 0; i < 6; i++) {
document.write('<tr>');
for (j = 0; j < 7; j++) {
gNum = i * 7 + j;
document.write('<td id="GD' + gNum + '"><font id="SD' + gNum + '" ');
if (j == 0) document.write(' color=red');
if (j == 6) document.write(' color=blue');
document.write('></font><br><font id="LD' + gNum + '" "></font></td>');
}
document.write('</tr>');
}
</script>
</table>
</form>
</body>
</html>
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。
DDR爱好者之家 Design By 杰米
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
DDR爱好者之家 Design By 杰米
暂无评论...
更新日志
2024年11月25日
2024年11月25日
- 凤飞飞《我们的主题曲》飞跃制作[正版原抓WAV+CUE]
- 刘嘉亮《亮情歌2》[WAV+CUE][1G]
- 红馆40·谭咏麟《歌者恋歌浓情30年演唱会》3CD[低速原抓WAV+CUE][1.8G]
- 刘纬武《睡眠宝宝竖琴童谣 吉卜力工作室 白噪音安抚》[320K/MP3][193.25MB]
- 【轻音乐】曼托凡尼乐团《精选辑》2CD.1998[FLAC+CUE整轨]
- 邝美云《心中有爱》1989年香港DMIJP版1MTO东芝首版[WAV+CUE]
- 群星《情叹-发烧女声DSD》天籁女声发烧碟[WAV+CUE]
- 刘纬武《睡眠宝宝竖琴童谣 吉卜力工作室 白噪音安抚》[FLAC/分轨][748.03MB]
- 理想混蛋《Origin Sessions》[320K/MP3][37.47MB]
- 公馆青少年《我其实一点都不酷》[320K/MP3][78.78MB]
- 群星《情叹-发烧男声DSD》最值得珍藏的完美男声[WAV+CUE]
- 群星《国韵飘香·贵妃醉酒HQCD黑胶王》2CD[WAV]
- 卫兰《DAUGHTER》【低速原抓WAV+CUE】
- 公馆青少年《我其实一点都不酷》[FLAC/分轨][398.22MB]
- ZWEI《迟暮的花 (Explicit)》[320K/MP3][57.16MB]