万年历的代码

最新推荐文章于 2024-04-18 15:05:16 发布
最新推荐文章于 2024-04-18 15:05:16 发布
阅读量260 收藏 1
点赞数 1
文章标签： 数学建模 html servlet
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yun039018/article/details/130922755
版权

 

html部分：

  <div id="ll">

        <div id="box">

            <div id="aa">

                <div id="bb">星期二</div>

                <div id="cc">9</div>

            </div>

            <div id="dd">

                <div id="ee">2023-05-09</div>

            </div>

            <div id="ff">

                <div id="gg">

                    <div class="a1">三月二十</div>

                    <div class="a2">癸卯年 兔</div>

                    <div class="a3">丁巳月 丁卯日</div>

                </div>

                <div id="hh">

                    <div class="a4">宜:订盟 纳采 祭祀 动土 破土 交易 立券</div>

                    <div class="a5"> 忌：嫁娶 安葬 </div>

                </div>

            </div>

            <div>

                <input type="text" id="bwl">

                <button id="bwl-1">保存</button>

                <button id="bwl-2">清除</button>

            </div>

        </div>

        <select id="yun" οnchange="getRun();jyq();sum()"></select>

        <select id="yun1" οnchange="jyq()"></select>

        <button id="nav6" οnclick="uu()">上一月</button>

        <button id="nav7" οnclick="zz()">下一月</button>

        <button id="fan" οnclick="oo()">返回今天</button>

        <div class="e1">

            <table class="e2">

                <tr>

                    <td class="e3">一</td>

                    <td class="e3">二</td>

                    <td class="e3">三</td>

                    <td class="e3">四</td>

                    <td class="e3">五</td>

                    <td class="e3">六</td>

                    <td class="e3">日</td>

                </tr>

            </table>

            <div id="date">

            </div>

        </div>

    </div>

    </div>

css部分：

* {

    border: 0;

    border-collapse: collapse;

    border-spacing: 0;

    list-style: none;

    margin: 0;

    padding: 0;

}

#ll{

    width: 610px;

    height: 560px;

    background-image: url(16154396841752805.gif);

    background-repeat: no-repeat;

    background-size:610px 559px;

    border: 1px solid rgb(240, 215, 215);

}

#box {

    width: 574px;

    height: 88px;

    color: #fff;

    /* background: linear-gradient(180deg,#0064d9,#11428c); */

    border-radius: 6px 6px 0 0;

    padding: 0px 18px;

    display: flex;

    min-height: 88px;

    align-items: center;

}

#aa {

    width: 64px;

    height: 64px;

    color: #111;

    display: flex;

    flex-direction: column;

    margin-right: 20px;

    border-radius: 8px;

    background:  rgb(248, 240, 240);

    align-items: center;

    justify-content: center;

    position: relative;

}

#bb {

    width: 48px;

    height: 20.8px;

    color: rgb(8, 72, 128);

    font-size: 12px;

    align-items: center;

    padding: 3px 0px 0px 11px;

    /* border: 1px solid yellow; */

}

#cc {

    width: 17.8px;

    height: 25px;

    font-size: 25px;

    /* border: 1px solid rgb(9, 194, 207); */

}

#dd {

    width: 170px;

    height: 32px;

    display: flex;

    flex-direction: column;

    line-height: 20px;

    justify-content: center;

    min-width: 170px;

    /* border: 1px solid rgb(64, 247, 9); */

}

#ee {

    line-height: 32px;

    font-size: 24px;

    font-weight: 600;

}

#ff {

    width: 261px;

    height: 60px;

    border-left: 1px solid rgba(255, 255, 255, .3);

    padding-left: 16px;

    display: flex;

    flex-direction: column;

    justify-content: center;

}

#gg {

    width: 244px;

    height: 20px;

    display: flex;

    line-height: 20px;

    /* border: 1px solid rgb(252, 3, 190); */

}

.a1 {

    width: 86px;

    height: 20px;

    font-size: 14px;

    padding: 0px 4px 0px 0px;

    /* border: 1px solid rgb(2, 226, 32); */

}

.a2 {

    width: 70px;

    height: 20px;

    font-size: 14px;

    /* border: 1px solid rgb(0, 231, 212); */

}

.a3 {

    width: 101px;

    height: 20px;

    font-size: 14px;

    /* border: 1px solid rgb(231, 255, 17); */

}

#hh {

    width: 244px;

    height: 40px;

}

.a4 {

    width: 243px;

    height: 20px;

    font-size: 14px;

    /* border: 1px solid red; */

}

.a5 {

    width: 101px;

    height: 20px;

    font-size: 14px;

    /* border: 1px solid blue; */

}

#date {

    border:  1px solid rgba(236, 236, 236, 0.733);

    width: 400px;

}

#yun {

    border: 1px solid gray;

    width: 80px;

    height: 25px;

    text-align: center;

    border-radius: 10px;

}

#yun1 {

    border: 1px solid gray;

    width: 60px;

    height: 25px;

    text-align: center;

    border-radius: 10px;

}

#nav6{

    border: 1px solid gray;

    width: 60px;

    height: 25px;

    text-align: center;

    border-radius: 10px;

}

#nav7{

    border: 1px solid gray;

    width: 60px;

    height: 25px;

    text-align: center;

    border-radius: 10px;

}

#fan {

    width: 80px;

    height: 22px;

    border-radius: 10px;

    border: 1px solid rgba(221, 221, 230, 0.909);    

    color: rgba(6, 6, 237, 0.909);

    background-color: white;

}

.e1 {

    width: 608px;

    height:445px;

    border: 1px solid rgba(255, 249, 249, 0.863);

}

.e2 {

    width: 608px;

    height: 36px;

    display: flex;

    border: 1px solid rgb(243, 243, 237);

}

.e3 {

    padding: 4px;

    width: 80px;

    height: 35px;

    text-align: center;

    border: 1px solid rgba(209, 209, 209, 0.438);

}

.tdx {

    border: 1px solid transparent;

    height: 77px;

    width: 88px;

    font-size: 20px;

    font-weight: 600;

    text-align: center;

}

.tdx:hover {

    border: 2px solid #b9b4b4;

}

#date{

   width: 606px;

   height: 406px;

   /* border: 1px solid rgb(248, 242, 242); */

}

#bwl{

    width: 80px;

    height: 80px;

    border: 1px solid red;

    margin: 16px 0px 0px 2px;

}

#bwl-1{

    width: 26px;

    height: 25px;

    font-size: 10px;

    position: relative;

    right: -56px;

    top: 10px;

    border: 1px solid blue;

}

#bwl-2{

    width: 26px;

    height: 25px;

    font-size: 10px;

    position: relative;

    right: 10px;

    top: 10px;

    border: 1px solid pink;

}

Java script部分：

  let newday = new Date();   //设定一个全局变量

    let nian = newday.getFullYear(); //返回年份

    let yue = newday.getMonth();     //返回月份

    let day = newday.getDate();

    let months = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]; //定义数组中月份的天数

    let Day = document.querySelector("#Day");

    let yun = document.querySelector("#yun");

    let yun1 = document.querySelector("#yun1");

    //循环出年、月

    for (var i = 1970; i < 2050; i++) {

        var newyun = document.createElement("option")

        newyun.text = i + "年";

        newyun.value = i;

        yun.add(newyun);

    }

    yun.value = newday.getFullYear();

    for (var i = 1; i <= 12; i++) {

        var newyun1 = document.createElement("option")

        newyun1.text = i + "月";

        newyun1.value = i;

        yun1.add(newyun1);

    }

    yun1.value = newday.getMonth() + 1;

    //判断平年还是闰年   //这个表达式不是判断year是否“是闰年”，而是判断year是否“不是闰年”。

    function getRun() {

        const year = document.getElementById('yun').value;

        if ((year % 4 != 0) || (year % 100 == 0 && year % 400 != 0)) {

            months[1] = 29;

        } else {

            months[1] = 28;

        }

    }

    getRun();

    let shang = document.getElementById('nav6');

    let xia = document.getElementById('nav7');

    let hui = document.getElementById('fan');

    function uu() {

        yun1.value -= 1;

        if (yun1.value == '') {

            yun1.value = 12;

            yun.value -= 1;

        }

        jyq();

    }

    function zz() {

        yun1.value = yun1.value * 1 + 1;

        if (yun1.value == '') {

            yun1.value = 1;

            yun.value = yun.value * 1 + 1;

        }

        jyq();

    }

    function oo() {

        yun.value = nian;

        yun1.value = yue + 1;

        jyq();

    }

    //表格

    function jyq() {

        const year = yun.value;

        const month = yun1.value;

        const monthNum = months[month - 1];//monthNum:月数

        const week = new Date(year, month - 1, 1).getDay();

        const box1 = document.querySelector("#date");

        box1.innerHTML = "";

        var num = 1;

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

            let tr = document.createElement("tr");

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

                let td = document.createElement('td');

                if (!(j < week - 1 && i == 0)) {

                    if (num <= monthNum) {

                        td.innerHTML = num++;

                        td.classList.add("day", "tdx");

                    }

                }

                tr.appendChild(td);

            }

            box1.appendChild(tr);

        }

        //点击月份中的几号跳转

        let yi = document.querySelectorAll("td.day");

        for (let i = 0; i < yi.length; i++) {

            yi[i].onclick = function () {

                day = this.innerText * 1;

                sum();

                bwl()

            }

        }

    }

    jyq();

    bwl()

    for (let i = 0; i < yun.length; i++) {

        yun[i].onchange = function () {

            nain = this.innerText * 1;

        }

        // for (let j = 0; j < yun1.length; j++) {

        //     yun1[j].onchange = function () {

        //         yue = this.innerText * 1;

        //     }

        // }  

    }

    function sum() {

        let tempdate = calendar.solar2lunar(yun.value, yun1.value, day);

        console.log(tempdate);

        document.querySelector("#bb").innerText = tempdate.ncWeek;

        document.querySelector("#cc").innerText = day;

        document.querySelector("#ee").innerText = `${yun.value}-${yun1.value}-${day}`;

        document.querySelector(".a1").innerText = tempdate.IMonthCn + tempdate.IDayCn;

        document.querySelector(".a2").innerText = tempdate.gzYear + tempdate.Animal;

        document.querySelector(".a3").innerText = tempdate.gzMonth + tempdate.gzDay;

    }

   

    function getCookie() {

        const strCookie = document.cookie;

        const obj = {};

        if (strCookie != "") {

            const cookitem = strCookie.split("; ")

            console.log(cookitem);

            for (let i = 0; i < cookitem.length; i++) {

                const arr = cookitem[i].split("=");

                obj[arr[0]] = arr[1];

            }

        }

        return obj;

    }

    getCookie();

    document.getElementById("bwl-1").onclick = function baocuncookie() {

        const bwl = document.getElementById("bwl");

        const years = document.getElementById("ee");

        if (bwl.value == "") {

            const obj = getCookie();

            if (!(obj[years.innerHTML])) {

                console.log(obj[years.innerHTML]);

                return

            }

        }

        document.cookie = `${years.innerText}=${bwl.value};max-age=${60*10}`;

    }

    document.getElementById("bwl-2").οnclick=function quchucookie(){

        const bwl = document.getElementById("bwl");

        document.cookie=bwl.value="";

       

    }

    function bwl() {

        const bwl = document.getElementById("bwl");

         bwl.value = "";

        const years = document.getElementById("ee");

        const obj = getCookie();

        if (obj[years.innerHTML]) {

            bwl.value = obj[years.innerHTML];

        }

    }

小易幽
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
Html+jquery实现万年历（超强大的功能）
07-01
Html+jquery实现万年历（超强大的功能） 可手动添加法定节假日，做日历展示最帅了，自定义日历样式
万年历黄历html小程序
03-25
万年历黄历html小程序 直接可用，也可加入自己的内容； 出门看黄历，吉祥又如意，免费实惠就是老黄历！
万年历html源码，风格优美，功能强大
07-08
万年历html源码，风格优美，功能强大万年历html源码，风格优美，功能强大
万年历的实现
qq_56206082的博客
09-07 872
首先知道具体要实现的功能 实现选择不同年月，实现日历的效果 1.html代码 <div id="calendar"> <div id="top"> <!-- onchange事件，当用户改变input属性时，执行一段js代码 --> <select id="year" onchange="hqx()"></select><span>年</span> <select id="month" o
html日历页面节假日_基于jquery实现可查询节假日万年历代码
weixin_31487533的博客
12-28 787
特效描述：基于jquery实现 可查询节假日 万年历代码。基于jquery实现可查询节假日万年历代码代码结构1. 引入CSS2. 引入JS3. HTML代码style="cursor:hand;color: white; border-bottom: 1px solid white;"onclick="dateSelection.show()">class="topDateFont">...
按月显示的万年历（含农历）网页代码
明月松间照，清泉石上流（已停用）
01-14 3520
/*****************************************************************************按月显示的万年历（含农历）网页代码*****************************************************************************/日历/************************
js怎么制作html的主题,js+html制作简单日历的方法
weixin_30345333的博客
05-31 244
新手一枚，不会写什么高大上的博文，一些平时做的小练习，献丑代码：无标题文档* {margin: 0;padding: 0}#calendar {width: 210px;margin: 100px auto;overflow: hidden;border: 1px solid #000;padding: 20px;position: relative}#calendar h4 {text-alig...
万年历 html 代码,用javascript 实现的万年历代码。
weixin_32734545的博客
06-09 1456
日历test*{ margin:0px; padding:0px;}#dateBody{width:300px; padding:10px; background:#CCC;}.weekday{ width:40px; height:40px; background:#999; line-height:30px; margin:1px; text-align:center; margin-top:...
万年历、日历——拿来即用（简单易上手，操作方便）
weixin_57285134的博客
05-12 1588
前段时间用到了搞出来了，所以就和大家分享一下，上成果。整个日历结构还是比较简单的，注释啥的都给大哥们整好了，都是手写的静态数据请放心食用，效果图呈上！ HTML代码： CSS代码： JS代码： 大功告成！最后欢迎大家讨论发言，提出问题~~~
写一个完整的万年历网页
weixin_42610671的博客
02-14 328
首先需要了解一些前端开发的基础知识，包括 HTML、CSS 和 JavaScript。 HTML: 使用 HTML 来构建网页的基本布局。 CSS: 用来美化网页，设置字体、颜色、布局等。 JavaScript: 用来添加动态效果，如按钮交互、日历生成等。 实现万年历的功能，需要以下步骤： 创建一个日历模板，使用 HTML 元素表示日期、星期等信息。 使用 JavaScript 获取...
网页万年历代码
12-26
javacript代码，可以嵌套到网页中，或者单独页面
WEB手机端万年历日历代码
11-09
手机端web万年历 html5
网页日历制作代码
04-25
通过网页制作实现制作日历的源代码,有详细的编写过程
万年历（带农历） VB源码
08-10
万年历（带农历） 万年历（带农历） 万年历（带农历）
万年历源代码
07-18
本万年历为天文计算万年历，其中四柱生克表为CGRIDCTRL控件，可以进行增减行列、合并单元格、打印及打印预览等操作。
万年历C代码！.rar
09-02
很好的万年历制作C代码，我自己试着做了一个，效果还可以。 电子 , 工作室 , 万年历 , 源代码 , 制作
简洁PHP万年历 代码
08-07
简洁PHP万年历代码，思路清晰简洁易懂，适合入门
C++实现万年历源代码
12-20
本文实例为大家分享了C++实现万年历的具体代码，供大家参考，具体内容如下 #include #include #include #include using namespace std; #include ofstream fout("日历.txt"); void Printtitle(int n); int OrEndl...
2024数学建模时间汇总与竞赛攻略
最新发布
qq_41489047的博客
04-18 1107
数模比赛视频讲解：（关注B站 ：white学长努力中），提供思路讲解，white学长建模美赛M奖，国赛北京市二等奖，擅长做评价类题目。比赛时间：北京时间2024年2月2日早晨6：00至2024年2月6日上午9：00。奖项设置：特等奖、特等奖提名奖、一等奖、二等奖、优秀奖。奖项设置：根据等级分为O奖、F奖、M奖、H奖和S奖。奖项设置：特等奖、一等奖、二等奖、三等奖和优秀奖。奖项设置：一等奖、二等奖、三等奖和优秀奖。奖项设置：一等奖、二等奖、三等奖、优秀奖。奖项设置：一等奖、二等奖、三等奖、优秀奖。
万年历quartus代码
06-26
### 回答1： 万年历的Quartus代码主要是实现了一个可以在FPGA上运行的万年历系统。该代码包含了时钟分频器、BCD数码管、按键输入和状态机控制等模块。 其中，时钟分频器模块会将输入的时钟信号分频后输出给BCD数码管，使其可以正常显示日期和时间。按键输入模块则负责响应用户的设置操作，例如设置日历、选择显示格式等。状态机控制模块则负责控制整个系统的逻辑流程，使其可以实现正确的操作。 在代码实现过程中，需要按照功能分模块，将各个模块连接起来，确保整个系统的正确运行。同时，在调试过程中需要不断的进行仿真和实验，以保证代码的正确性和稳定性。 总之，万年历的Quartus代码是一项涉及多个模块、功能较为复杂的系统设计任务，需要有一定的硬件设计和编程经验才能完成。 ### 回答2： 万年历quartus代码是一种使用FPGA芯片来实现日历功能的代码。它可以在FPGA芯片上构建一个完整的日历应用，包括年份、月份、日期、星期、农历等信息的显示和计算。通过这个应用程序，用户可以查看任何日期的日历信息。 该代码主要由FPGA的Verilog语言编写。它使用FPGA的时钟驱动电路，实现对系统时钟的采样和分频。这个时钟驱动电路可以通过改变时钟分频系数来实现不同的世界标准时间，方便用户在不同时间区域中使用该应用程序。 另外，该代码还包括了一些优化算法来实现日历的计算。其中，最重要的是农历算法和月相计算算法。农历算法是根据太阳和月亮运行规律，计算出农历每一年的各个月份及其节气。月相计算算法是根据日月亮的位置关系，计算出月相、朔望及月亮运行周期等信息。 最终，该代码可以通过Quartus软件编译成二进制文件，并烧录到FPGA芯片中。用户可以通过FPGA芯片上的按键或其他输入接口来操作日历应用程序，使其显示和计算不同日期的日历信息。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值