整合營銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
近有用到日歷可需要編輯文本的日歷，為了綁定數(shù)據(jù)的方便，所以用js寫了一套日歷，其實(shí)思想也是很簡單。
實(shí)現(xiàn)步驟如下：
1：首先取得處理月的總天數(shù)
JS不提供此參數(shù)，我們需要計(jì)算。考慮到閏年問題會(huì)影響二月份的天數(shù)，我們先編寫一個(gè)判斷閏年的自編函數(shù)：
function is_leap(year) {
return (year%100==0?res=(year%400==0?1:0):res=(year%4==0?1:0));
}
2：接著定義一個(gè)包含十二個(gè)月在內(nèi)的月份總天數(shù)的數(shù)組：
m_days=new Array(31,28+is_leap(ynow),31,30,31,31,30,31,30,31,30,31);
3：m_days這個(gè)數(shù)組里，二月份的天數(shù)已經(jīng)加入閏年的信息：28+is_leap(ynow)。數(shù)組元素從0開始，正好對應(yīng)于JS提供的Date函數(shù)提供的getMonth返回值，即0表示一月，1表示二月，2表示三月，依此類推。
這樣，各月總數(shù)可以這樣取得：m_days[x]。其中，x為0至11的自然數(shù)。
4：計(jì)算處理月第一天是星期幾
可以使用Date函數(shù)的getDay取得，返回的值從0到6，0表示星期一，1表示星期二，2表示星期三，其余依此類推。代碼如下（假設(shè)要處理的時(shí)間為2008年3月）：
n1str=new Date(2008,3,1);
firstday=n1str.getDay();
有了月總天數(shù)和該月第一天是星期幾這兩個(gè)已知條件，就可以解決表格所需行數(shù)問題：（當(dāng)前月天數(shù)+第一天是星期幾的數(shù)值）除以七。表格函數(shù)需要整數(shù)，因此，我們使用Math.ceil來處理：
tr_str=Math.ceil((m_days[mnow] + firstday)/7);
表格中的tr標(biāo)簽實(shí)際上代表表格的行，因此變量tr_str是我們往下寫表格的重要依據(jù)。
5：打印日歷表格
可以使用兩個(gè)for語句嵌套起來實(shí)現(xiàn)：外層for語句寫行，內(nèi)層for語句寫單元格。
for(i=0;i<tr_str;i++) { //表格的行
for(k=0;k<7;k++) { //表格每行的單元格
idx=i*7+k; //單元格自然序列號(hào)
date_str=idx-firstday+1; //計(jì)算日期
(date_str<=0 || date_str>m_days[mnow]) ? date_str=" " : date_str=idx-firstday+1; //過濾無效日期（小于等于零的、大于月總天數(shù)的）
$(".date-info .date").last().append("<td class='day'>" + date_str + "</td>");
}
}
單元格的自然序號(hào)是否代表有效日期非常關(guān)鍵，為此必須加入一個(gè)過濾機(jī)制：僅打印有效的日期。有效的日期大于0小于小于等于處理月的總天數(shù)。
6：上一個(gè)月與下一個(gè)月
if(mnow<=0){
mnow=11;
ynow=ynow-1;
}else{
mnow--;
}
if(mnow>=11){
mnow=0;
ynow=ynow+1;
}else{
mnow++;
}
獲取上一個(gè)月時(shí)，到1月份需注意；獲取下一個(gè)月時(shí)，到12月份時(shí)要注意。
渲染時(shí)，需要先移除舊的日歷，再添加新的日歷。
開源日記],分享10k+Star的優(yōu)質(zhì)開源項(xiàng)目
TOAST UI Calendar 是一個(gè)多功能的日歷組件，它支持純 JavaScript、React 和 Vue 組件。它不僅提供了基本的日歷功能，還包含了許多高級(jí)特性，如拖拽調(diào)整日程、默認(rèn)彈出窗口等，使得用戶可以輕松管理自己的日程安排。
功能特點(diǎn)
TOAST UI Calendar 適用于需要日程管理功能的各種 web 應(yīng)用，包括但不限于：
開源地址:https://github.com/nhn/tui.calendar[開源日記],分享10k+Star的優(yōu)質(zhì)開源項(xiàng)目
創(chuàng)作不易分享,贊,在看,三連支持一波,感謝。↓↓↓
Lunar 是一個(gè)支持陽歷、陰歷、佛歷以及道歷的日歷工具庫，開源且免費(fèi), 有多種開發(fā)語言的版本，并且不依賴第三方，支持了陽歷、陰歷、佛歷、道歷、儒略日的相互轉(zhuǎn)換。
另外還支持星座、干支、生肖、節(jié)氣、節(jié)日、彭祖百忌、吉神宜趨、兇煞宜忌、沖煞、納音、星宿、八字、五行、十神、建除十二值星、青龍名堂等十二神、黃道日及吉兇等。
HTML頁面 lunar兼容UMD (Universal Module Definition)，同時(shí)在IE7上也能正常工作，在頁面中直接引入 lunar.js 文件即可。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>MyTitle</title>
</head>
<body>
<!-- 使用CDN -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/lunar-javascript/1.6.4/lunar.min.js"></script>
<script>
console.log(Lunar.fromDate(new Date()).toFullString());
console.log(Solar.fromYmd(2016, 1, 1).toFullString());
console.log(HolidayUtil.getHoliday(2020, 5, 2) + '');
</script>
</body>
</html>Java
// https://search.maven.org/artifact/cn.6tail/lunar
// maven
<dependency>
<groupId>cn.6tail</groupId>
<artifactId>lunar</artifactId>
<version>1.3.6</version>
</dependency>
// gradle
implementation 'cn.6tail:lunar:1.3.6'
import com.nlf.calendar.Lunar;
import com.nlf.calendar.Solar;
import com.nlf.calendar.util.HolidayUtil;
System.out.println(Lunar.fromDate(new Date()).toFullString());
System.out.println(Solar.fromYmd(2016, 1, 1).toFullString());
System.out.println(HolidayUtil.getHoliday(2020, 5, 2));c#.net
// https://www.nuget.org/packages/lunar-csharp
using Lunar;
using Lunar.Util;
Console.WriteLine(Lunar.Lunar.FromDate(DateTime.Now).FullString);
Console.WriteLine(Solar.FromYmd(2016, 1, 1).FullString);
Console.WriteLine(HolidayUtil.GetHoliday(2020, 5, 2));
仿百度搜索月歷
月歷
周歷
老黃歷
https://6tail.cn/calendar
*請認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。
