单日切换的日历（上一天下一天）
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了单日切换的日历（上一天下一天）相关的知识，希望对你有一定的参考价值。
最近在做这个手机页面 ， 饼图均是用CSS3实现的。日期切换 JS代码如下（自己写的，轻测无BUG）：
贴代码进来后居然直接可以预览;:下面是效果（可以点击哦）
JS单日的日历（上一天、下一天）：
日历
< 当前日期 >
代码：
<!DOCTYPE html>
<html>
<head>
<title>日历</title>
<style>
span:first-child,
span:last-child{display: inline-block;background: #ccc;width: 20px;text-align: center;}
</style>
</head>
<body>
<div id="date">
<span><</span>
<span>当前日期</span>
<span>></span>
</div>
<script type="text/javascript">
// 获取页面UI
var date_view = document.getElementById(‘date‘),
btn_prev = date_view.getElementsByTagName(‘span‘)[0],
date_text = date_view.getElementsByTagName(‘span‘)[1],
btn_next = date_view.getElementsByTagName(‘span‘)[2];// 获取时间
var d = new Date(),
year = d.getFullYear(),
month = d.getMonth() + 1,
date = d.getDate();date_text.innerHTML = year + ‘年‘ + month + ‘月‘ + date + ‘日‘;
btn_prev.onclick = function(){
date--
month_pd()
date_text.innerHTML = year + ‘年‘ + month + ‘月‘ + date + ‘日‘;
}
btn_next.onclick = function(){
date++
month_pd()
date_text.innerHTML = year + ‘年‘ + month + ‘月‘ + date + ‘日‘;
}
function month_pd(){
function set_date(nd){
if(date>nd){
date = 1
month = month+1
if(month>12){month=1;year =year+1}
}
if(date<1){
month = month-1
if(month<1){month=12;year =year-1}
date = new Date(year,month-1,0).getDate()
}
}
if (year % 400 == 0 || (year % 4 == 0 && year % 100 != 0)) isy = true;
switch(month){
case 1:
case 3:
case 5:
case 7:
case 8:
case 10:
case 12:
set_date(31)
break;
case 4:
case 6:
case 9:
case 11:
set_date(30)
break;
case 2:
if(isy){
set_date(29)
}else{
set_date(28)
}
break;
}
}
</script>
</body>
</html>
以上是关于单日切换的日历（上一天下一天）的主要内容，如果未能解决你的问题，请参考以下文章