FullCalendar应用——整合农历节气和节日

FullCalendar用来做日程管理功能非常强大,但是唯一不足的地方是没有将中国农历历法加进去,今天我将结合实例和大家分享如何将中国农历中的节气和节日整合到FullCalendar中,从而增强其实用性。

HTML

首先是要载入jQuery库和fullcalendar插件。

<script src='js/jquery-1.9.1.min.js'></script> 
<script src='js/fullcalendar.min.js'></script> 

然后在body中,建立日历容器div#calendar。

<div id="calendar"></div> 
jQuery

使用jQuery调用fullcalendar插件,方法如下,值得一提的是events数据源来自json.php,这个PHP文件负责读取数据并返回json格式的日程安排数据给前端。

$(function() 
    $('#calendar').fullCalendar(
        header: 
            left: 'prev,next today', 
            center: 'title', 
            right: 'month,agendaWeek,agendaDay' 
        }, 
        selectable: true, 
        events: 'json.php' //数据源 
    }); 
}); 

以上代码就可以展示一个日历界面,但是需要加入农历,则需要将农历算法代码整合到fullCalendar中,并且需要将fullCalendar.js中的代码稍微改动下,以下是网友@太空飛豬以及/可爱/玫瑰提供的中国农历算法javascript版,再此一并感谢!

function RunGLNL() 
    var today = new Date(); 
    var d = new Array("周日", "周一", "周二", "周三", "周四", "周五", "周六"); 
    var DDDD = d[today.getDay()]; 
    DDDD = DDDD + " " + (CnDateofDateStr(today)); //显示农历 
    DDDD = DDDD + SolarTerm(today); //显示二十四节气 
    document.write(DDDD); 

function DaysNumberofDate(DateGL) 
    return parseInt((Date.parse(DateGL) - Date.parse(DateGL.getFullYear() + "/1/1")) / 86400000) + 1; 

function CnDateofDate(DateGL) 
    var CnData = new Array( 
        0x16, 0x2a, 0xda, 0x00, 0x83, 0x49, 0xb6, 0x05, 0x0e, 0x64, 0xbb, 0x00, 0x19, 0xb2, 0x5b, 0x00, 
        0x87, 0x6a, 0x57, 0x04, 0x12, 0x75, 0x2b, 0x00, 0x1d, 0xb6, 0x95, 0x00, 0x8a, 0xad, 0x55, 0x02, 
        0x15, 0x55, 0xaa, 0x00, 0x82, 0x55, 0x6c, 0x07, 0x0d, 0xc9, 0x76, 0x00, 0x17, 0x64, 0xb7, 0x00, 
        0x86, 0xe4, 0xae, 0x05, 0x11, 0xea, 0x56, 0x00, 0x1b, 0x6d, 0x2a, 0x00, 0x88, 0x5a, 0xaa, 0x04, 
        0x14, 0xad, 0x55, 0x00, 0x81, 0xaa, 0xd5, 0x09, 0x0b, 0x52, 0xea, 0x00, 0x16, 0xa9, 0x6d, 0x00, 
        0x84, 0xa9, 0x5d, 0x06, 0x0f, 0xd4, 0xae, 0x00, 0x1a, 0xea, 0x4d, 0x00, 0x87, 0xba, 0x55, 0x04 
    ); 
    var CnMonth = new Array(); 
    var CnMonthDays = new Array(); 
    var CnBeginDay; 
    var LeapMonth; 
    var Bytes = new Array(); 
    var I; 
    var CnMonthData; 
    var DaysCount; 
    var CnDaysCount; 
    var ResultMonth; 
    var ResultDay; 
    var yyyy = DateGL.getFullYear(); 
    var mm = DateGL.getMonth() + 1; 
    var dd = DateGL.getDate(); 
    if (yyyy < 100) yyyy += 1900; 
    if ((yyyy < 1997) || (yyyy > 2020)) 
        return 0; 
    
    Bytes[0] = CnData[(yyyy - 1997) * 4]; 
    Bytes[1] = CnData[(yyyy - 1997) * 4 + 1]; 
    Bytes[2] = CnData[(yyyy - 1997) * 4 + 2]; 
    Bytes[3] = CnData[(yyyy - 1997) * 4 + 3]; 
    if ((Bytes[0] & 0x80) != 0) 
        CnMonth[0] = 12; 
    
    else 
        CnMonth[0] = 11; 
    
    CnBeginDay = (Bytes[0] & 0x7f); 
    CnMonthData = Bytes[1]; 
    CnMonthData = CnMonthData << 8; 
    CnMonthData = CnMonthData | Bytes[2]; 
    LeapMonth = Bytes[3]; 
    for (I = 15; I >= 0; I--) 
        CnMonthDays[15 - I] = 29; 
        if (((1 << I) & CnMonthData) != 0) 
            CnMonthDays[15 - I]++; 
        
        if (CnMonth[15 - I] == LeapMonth) 
            CnMonth[15 - I + 1] = -LeapMonth; 
        
        else 
            if (CnMonth[15 - I] < 0) 
                CnMonth[15 - I + 1] = -CnMonth[15 - I] + 1; 
            
            else 
                CnMonth[15 - I + 1] = CnMonth[15 - I] + 1; 
            
            if (CnMonth[15 - I + 1] > 12) 
                CnMonth[15 - I + 1] = 1; 
            
        
    
    DaysCount = DaysNumberofDate(DateGL) - 1; 
    if (DaysCount <= (CnMonthDays[0] - CnBeginDay)) 
        if ((yyyy > 1901) && (CnDateofDate(new Date((yyyy - 1) + "/12/31")) < 0)) 
            ResultMonth = -CnMonth[0]; 
        
        else 
            ResultMonth = CnMonth[0]; 
        
        ResultDay = CnBeginDay + DaysCount; 
    
    else 
        CnDaysCount = CnMonthDays[0] - CnBeginDay; 
        I = 1; 
        while ((CnDaysCount < DaysCount) && (CnDaysCount + CnMonthDays[I] < DaysCount)) 
            CnDaysCount += CnMonthDays[I]; 
            I++; 
        
        ResultMonth = CnMonth[I]; 
        ResultDay = DaysCount - CnDaysCount; 
    
    if (ResultMonth > 0) 
        return ResultMonth * 100 + ResultDay; 
    
    else 
        return ResultMonth * 100 - ResultDay; 
    

function CnYearofDate(DateGL) 
    var YYYY = DateGL.getFullYear(); 
    var MM = DateGL.getMonth() + 1; 
    var CnMM = parseInt(Math.abs(CnDateofDate(DateGL)) / 100); 
    if (YYYY < 100) YYYY += 1900; 
    if (CnMM > MM) YYYY--; 
    YYYY -= 1864; 
    return CnEra(YYYY) + "年"; 

function CnMonthofDate(DateGL) 
    var CnMonthStr = new Array("零", "正", "二", "三", "四", "五", "六", "七", "八", "九", "十", "冬", "腊"); 
    var Month; 
    Month = parseInt(CnDateofDate(DateGL) / 100); 
    if (Month < 0) 
        return "闰" + CnMonthStr[-Month] + "月"; 
    
    else 
        return CnMonthStr[Month] + "月"; 
    

function CnDayofDate(DateGL) 
    var CnDayStr = new Array("零", 
        "初一", "初二", "初三", "初四", "初五", 

转载于:https://www.cnblogs.com/zhangwc/p/6255042.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值