首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Javascript

javascript实现带节日和农历的日历特效

Posted in Javascript onFebruary 01, 2015

带节日和农历的脚本：

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<TITLE>带农历的日历</TITLE>          

<SCRIPT language="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)?1:0;

   return(sum+leapDays(y));

}

//返回农历y年闰月的天数

function leapDays(y) {

   if(leapMonth(y))  return((lunarInfo[y-1900] & 0x10000)? 30: 29);

   else return(0);

}

//判断y年的农历中那个月是闰月,不是闰月返回0

function leapMonth(y){

   return(lunarInfo[y-1900]&0xf);

}

//返回农历y年m月的总天数

function monthDays(y,m){

   return((lunarInfo[y-1900]&(0x10000>>m))?30:29);

}

//算出当前月第一天的农历日期和当前农历日期下一个月农历的第一天日期

function Dianaday(objDate) {

   var i, leap=0, temp=0;

   var baseDate = new Date(1900,0,31);

   var offset   = (objDate - baseDate)/86400000;

   this.dayCyl = offset+40;

   this.monCyl = 14;

   for(i=1900; i<2050 && offset>0; i++) {

      temp = lYearDays(i)

      offset -= temp;

      this.monCyl += 12;

   }

   if(offset<0) {

      offset += temp;

      i--;

      this.monCyl -= 12;

   }

   this.year = i;

   this.yearCyl=i-1864;

   leap = leapMonth(i); //闰哪个月

   this.isLeap = false;

   for(i=1; i<13 && offset>0; i++) {

      if(leap>0 && i==(leap+1) && this.isLeap==false){    //闰月

          --i; this.isLeap = true; temp = leapDays(this.year);}

      else{

         temp = monthDays(this.year, i);}

      if(this.isLeap==true && i==(leap+1)) this.isLeap = false;    //解除闰月

      offset -= temp;

      if(this.isLeap == false) this.monCyl++;

   }

   if(offset==0 && leap>0 && i==leap+1)

      if(this.isLeap){ this.isLeap = false;}

      else{this.isLeap=true;--i;--this.monCyl;}

   if(offset<0){offset+=temp;--i;--this.monCyl;}

   this.month=i;

   this.day=offset+1;

}

//返回公历y年m+1月的天数

function solarDays(y,m){

   if(m==1)

      return(((y%4==0)&&(y%100!=0)||(y%400==0))?29:28);

   else

      return(solarMonth[m]);

}

//记录公历和农历某天的日期

function calElement(sYear,sMonth,sDay,week,lYear,lMonth,lDay,isLeap) {

      this.isToday = false;

      //公历

      this.sYear = sYear;

      this.sMonth = sMonth;

      this.sDay = sDay;

      this.week = week;

      //农历

      this.lYear = lYear;

      this.lMonth = lMonth;

      this.lDay = lDay;

      this.isLeap = isLeap;

      //节日记录

      this.lunarFestival = ''; //农历节日

      this.solarFestival = ''; //公历节日

      this.solarTerms = ''; //节气

}

//返回某年的第n个节气为几日(从0小寒起算)

function sTerm(y,n) {

   var offDate = new Date((31556925974.7*(y-1900)+sTermInfo[n]*60000)+Date.UTC(1900,0,6,2,5));

   return(offDate.getUTCDate())

}

//保存y年m+1月的相关信息

var fat=mat=9;

var eve=0;

function calendar(y,m) {

   fat=mat=0;

   var sDObj,lDObj,lY,lM,lD=1,lL,lX=0,tmp1,tmp2;

   var lDPOS = new Array(3);

   var n = 0;

   var firstLM = 0;

   sDObj = new Date(y,m,1);    //当月第一天的日期

   this.length = solarDays(y,m);    //公历当月天数

   this.firstWeek = sDObj.getDay();    //公历当月1日星期几

   if ((m+1)==5){fat=sDObj.getDay()}

   if ((m+1)==6){mat=sDObj.getDay()}

   for(var i=0;i<this.length;i++) {

      if(lD>lX) {

         sDObj = new Date(y,m,i+1);    //当月第一天的日期

         lDObj = new Dianaday(sDObj);     //农历

         lY = lDObj.year;           //农历年

         lM = lDObj.month;          //农历月

         lD = lDObj.day;            //农历日

         lL = lDObj.isLeap;         //农历是否闰月

         lX = lL? leapDays(lY): monthDays(lY,lM); //农历当月最後一天

         if (lM==12){eve=lX}

         if(n==0) firstLM = lM;

         lDPOS[n++] = i-lD+1;

      }

      this[i] = new calElement(y,m+1,i+1,nStr1[(i+this.firstWeek)%7],lY,lM,lD++,lL);

      if((i+this.firstWeek)%7==0){

         this[i].color = 'red';  //周日颜色

      }

   }

   //节气

   tmp1=sTerm(y,m*2)-1;

   tmp2=sTerm(y,m*2+1)-1;

   this[tmp1].solarTerms = solarTerm[m*2];

   this[tmp2].solarTerms = solarTerm[m*2+1];

   if((this.firstWeek+12)%7==5)    //黑色星期五

      this[12].solarFestival += '黑色星期五';

   if(y==tY && m==tM) this[tD-1].isToday = true;    //今日

}

//用中文显示农历的日期

function cDay(d){

   var s;

   switch (d) {

      case 10:

         s = '初十'; break;

      case 20:

         s = '二十'; break;

         break;

      case 30:

         s = '三十'; break;

         break;

      default :

         s = nStr2[Math.floor(d/10)];

         s += nStr1[d%10];

   }

   return(s);

}

var cld;

function drawCld(SY,SM) {

   var TF=true;

   var p1=p2="";

   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?'闰':'') + cld[sD].lMonth + '月' + (monthDays(cld[sD].lYear,cld[sD].lMonth)==29?'小':'大')+'</b>';

         }

         else{lObj.innerHTML = cDay(cld[sD].lDay);}    //显示农历日

        var Slfw=Ssfw=null;

        s=cld[sD].solarFestival;

        for (var ipp=0;ipp<lFtv.length;ipp++){    //农历节日

            if (parseInt(lFtv[ipp].substr(0,2))==(cld[sD].lMonth)){

                if (parseInt(lFtv[ipp].substr(2,4))==(cld[sD].lDay)){

                    lObj.innerHTML=lFtv[ipp].substr(5);

                    Slfw=lFtv[ipp].substr(5);

                }

            }

            if (12==(cld[sD].lMonth)){    //判断是否为除夕

                if (eve==(cld[sD].lDay)){lObj.innerHTML="除夕";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);

}

//-->

</SCRIPT> 

<BODY onload=initial()>

<CENTER>

<FORM name=CLD>

<TABLE>

  <TR>

    <TD align=middle>

      <TABLE border=1 cellpadding="0" cellspacing="0" bordercolordark="#FFFFFF" bordercolor="#ffffff" bordercolorlight="#EEEEEE">

        <TR bgcolor="#006600">

          <TD colSpan=7><FONT color=#ffffff style="FONT-SIZE: 9pt">公历 

            <SELECT name=SY onchange=changeCld() style="FONT-SIZE: 9pt"> 

            <SCRIPT language="JavaScript">

            for(i=1900;i<2050;i++) document.write('<option>'+i);

            </SCRIPT>

            </SELECT> 年 <SELECT name=SM onchange=changeCld() style="FONT-SIZE: 9pt"> 

            <SCRIPT language="JavaScript">

            for(i=1;i<13;i++) document.write('<option>'+i);

            </SCRIPT>

            </SELECT> 月 </FONT> <FONT color=#ffffff face=宋体 id=GZ style="FONT-SIZE: 12pt"></FONT><BR></TD>

        </TR>

        <TR align=middle bgColor=#e0e0e0>

          <TD width=54 style="font-size:9pt; padding:5pt;">日</TD>

          <TD width=54 style="font-size:9pt ">一</TD>

          <TD width=54 style="font-size:9pt ">二</TD>

          <TD width=54 style="font-size:9pt ">三</TD>

          <TD width=54 style="font-size:9pt ">四</TD>

          <TD width=54 style="font-size:9pt ">五</TD>

          <TD width=54 style="font-size:9pt ">六</TD></TR>

          <SCRIPT language="JavaScript">

            var gNum;

            for(i=0;i<6;i++) {

               document.write('<tr align=center>');

               for(j=0;j<7;j++) {

                  gNum = i*7+j;

                  document.write('<td id="GD' + gNum +'"><font id="SD' + gNum +'" size=2 face="Arial Black"');

                  if(j == 0) document.write(' color=red');

                  if(j == 6) document.write(' color=#000080');

                  document.write(' TITLE=""> </font><br><font id="LD' + gNum + '" size=2 style="font-size:9pt"> </font></td>');

               }

               document.write('</tr>');

            }

           </SCRIPT>

        </TABLE>

</TD>

  </TR>

</TABLE>

</FORM>

</CENTER>

</BODY>

</HTML>

非常少见的，带节日和节气以及农历的日历特效，希望小伙伴们能够喜欢

javascript实现带节日和农历的日历特效

- Author -

hebedich

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐
基于jquery的滚动新闻列表
Jun 19 Javascript
jquery插件开发注意事项小结
Jun 04 Javascript
JavaScript 模拟类机制及私有变量的方法及思路
Jul 10 Javascript
Javascript中实现trim()函数的两种方法
Feb 04 Javascript
js实现的奥运倒计时时钟效果代码
Dec 09 Javascript
JS中常用的输出方式(五种)
Jun 12 Javascript
新闻上下滚动jquery 超简洁(必看篇)
Jan 21 Javascript
Bootstrap响应式导航由768px变成992px的实现代码
Jun 15 Javascript
js实现京东轮播图效果
Jun 30 Javascript
JS实现延迟隐藏功能的方法(类似QQ头像鼠标放上展示信息)
Dec 28 Javascript
动态加载权限管理模块中的Vue组件
Jan 16 Javascript
在Vue中用canvas实现二维码和图片合成海报的方法
Jun 10 Javascript
2种jQuery 实现刮刮卡效果
Feb 01 #Javascript
jQuery实现炫酷的鼠标轨迹特效
Feb 01 #Javascript
jQuery+CSS3实现树叶飘落特效
Feb 01 #Javascript
jquery实现勾选复选框触发事件给input赋值
Feb 01 #Javascript
jQuery结合HTML5制作的爱心树表白动画
Feb 01 #Javascript
jquery实现炫酷的叠加层自动切换特效
Feb 01 #Javascript
JavaScript插件化开发教程（六）
Feb 01 #Javascript
XPathParser(1) protocol(1) Stater(1) macos(1) ACID(1) csgo(1) mysqldump(1) sock(2) sentinel(1) xps(1)
You might like
php header()函数使用说明
2008/07/10 PHP
php去除重复字的实现代码
2011/09/16 PHP
php提示Call-time pass-by-reference has been deprecated in的解决方法[已测]
2012/05/06 PHP
PHP mysql事务问题实例分析
2016/01/18 PHP
PHP简单遍历对象示例
2016/09/28 PHP
php基于curl重写file_get_contents函数实例
2016/11/08 PHP
Yii实现复选框批量操作实例代码
2017/03/15 PHP
Thinkphp实现站点静态化的方法详解
2017/03/21 PHP
Javascript 继承机制的实现
2009/08/12 Javascript
AJAX分页的代码(后台asp.net)
2011/02/14 Javascript
js 调用本地exe的例子(支持IE内核的浏览器)
2012/12/26 Javascript
『JavaScript』限制Input只能输入数字实现思路及代码
2013/04/22 Javascript
纯JS实现五子棋游戏兼容各浏览器(附源码)
2013/04/24 Javascript
angularjs表格分页功能详解
2016/01/21 Javascript
ionic实现滑动的三种方式
2016/08/27 Javascript
基于JS对象创建常用方式及原理分析
2017/06/28 Javascript
详解Ant Design of React的安装和使用方法
2018/12/27 Javascript
JS实现将对象转化为数组的方法分析
2019/01/21 Javascript
微信小程序 确认框的实现（附代码）
2019/07/23 Javascript
d3.js实现图形缩放平移
2019/12/19 Javascript
Vue之封装公用变量以及实现方式
2020/07/31 Javascript
vue中jsonp插件的使用方法示例
2020/09/10 Javascript
Python中使用item()方法遍历字典的例子
2014/08/26 Python
python使用matplotlib绘图时图例显示问题的解决
2017/04/27 Python
canvas实现扭蛋机动画效果的示例代码
2018/10/17 HTML / CSS
阿联酋手表和配饰购物网站：Rivolishop
2019/11/25 全球购物
介绍一下SOA和SOA的基本特征
2016/02/24 面试题
优秀民警事迹材料
2014/01/29 职场文书
五好党支部事迹材料
2014/02/06 职场文书
文秘应聘自荐书范文
2014/02/18 职场文书
房屋转让协议书范本
2014/04/11 职场文书
2013年最新自荐信范文
2014/06/23 职场文书
幼儿园2014年度工作总结
2014/11/10 职场文书
感谢师恩主题班会
2015/08/17 职场文书
廉洁自律承诺书2016
2016/03/25 职场文书
Python必备技巧之字符数据操作详解
2022/03/23 Python