首页
所有分类
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 easyui的tabs使用时的问题
Mar 23 Javascript
jQuery结合PHP+MySQL实现二级联动下拉列表[实例]
Nov 15 Javascript
javascript简单比较日期大小的方法
Jan 05 Javascript
JavaScript中文件上传API详解
Apr 01 Javascript
jquery网页日历显示控件calendar3.1使用详解
Nov 24 Javascript
浅谈javascript中的事件冒泡和事件捕获
Dec 28 Javascript
js实现简单的选项卡效果
Feb 23 Javascript
基于javascript的异步编程实例详解
Apr 10 Javascript
vue-router跳转时打开新页面的两种方法
Jul 29 Javascript
用原生JS实现爱奇艺首页导航栏代码实例
Sep 19 Javascript
Angular value与ngValue区别详解
Nov 27 Javascript
vue实现移动端项目多行文本溢出省略
Jul 29 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
TOSHIBA(1) 手调机(1) 高放电路(1) 东芝(1) 数调机(1) 频率(1) RP-F11(1) 灵敏度(1) 频偏(1) 鉴频器(1)
You might like
解决phpmyadmin中文乱码问题。。。
2007/01/18 PHP
php之对抗Web扫描器的脚本技巧
2008/10/01 PHP
PHP 翻页 实例代码
2009/08/07 PHP
PHP微信开发之文本自动回复
2016/06/23 PHP
php使用json_decode后数字对象转换成了科学计数法的解决方法
2017/02/20 PHP
Laravel 自带的Auth验证登录方法
2019/09/30 PHP
用js遍历 table的脚本
2008/07/23 Javascript
javascript 获取页面的高度及滚动条的位置的代码
2010/05/06 Javascript
在jQuery 1.5中使用deferred对象的代码(翻译)
2011/03/10 Javascript
js 自动播放的实例代码
2013/11/19 Javascript
javascript图片滑动效果实现
2021/01/28 Javascript
javascript中去除数组重复元素的实现方法【实例】
2016/04/12 Javascript
Javascript实现跑马灯效果的简单实例
2016/05/31 Javascript
JavaScript实现审核流程状态的动态显示进度条
2017/03/15 Javascript
关于jQuery库冲突的完美解决办法
2017/05/20 jQuery
vue项目中axios使用详解
2018/02/07 Javascript
webstorm和.vue中es6语法报错的解决方法
2018/05/08 Javascript
Vue.js单向绑定和双向绑定实例分析
2018/08/14 Javascript
[02:50]【扭转乾坤，只此一招】DOTA2全新版本永雾林渊开启新篇章
2020/12/24 DOTA
跟老齐学Python之画圈还不简单吗？
2014/09/20 Python
Python求两个圆的交点坐标或三个圆的交点坐标方法
2018/11/07 Python
浅谈Python的list中的选取范围
2018/11/12 Python
python list多级排序知识点总结
2019/10/23 Python
Python 面向对象之封装、继承、多态操作实例分析
2019/11/21 Python
Python爬虫实现自动登录、签到功能的代码
2020/08/20 Python
英国Office鞋店德国网站：在线购买鞋子、靴子和运动鞋
2018/12/19 全球购物
澳大利亚窗帘商店：Curtain Wonderland
2019/12/01 全球购物
高校学生干部的自我评价分享
2013/11/04 职场文书
教师岗位职责
2013/11/17 职场文书
计算机毕业大学生推荐信
2013/12/01 职场文书
班主任工作经验材料
2014/02/02 职场文书
安全检查管理制度
2014/02/02 职场文书
2013年最新自荐信范文
2014/06/23 职场文书
办公经费申请报告
2015/05/15 职场文书
教师学习十八届五中全会精神心得体会
2016/01/05 职场文书
CocosCreator如何实现划过的位置显示纹理
2021/04/14 Javascript