Heim > Artikel > Web-Frontend > JS 操作日期顺便实现上一周和下一周功能_时间日期

JS 操作日期顺便实现上一周和下一周功能_时间日期

WBOYOriginal: 2016-05-16 18:43:481294Durchsuche

今天，一已工作的学生向我求助：
1. 页面加载时，一个地方显示当前日期，其左右各一个箭头，分别表示上一周，下一周
下面的表格显示本周每个日期，从周一到周日
2. 点左右箭头，那个地方显示上一周或下一周的今天，且下面的表格显示上一周或下一周的每个日期

JS本身没有提供日期加减操作能力，所以借此写了几个方法，用以操作日期，主要是实现日期的加减
作者：郴州拓职任文敏

jsDate.htm

//初始页面

function ini() { 
currDT = new Date();

showDate(); 
}

//上一周 或 下一周

function addWeek(ope) { 
var num = 0; 
if(ope=="-") { 
num = -7; 
} 
else if(ope=="+") { 
num = 7; 
}

currDT = addDate(currDT,num);

showDate(); 
}

function showDate() { 
span1.innerHTML = currDT.toLocaleDateString(); //显示日期

var dw = currDT.getDay(); 
var tdDT; 
//确定周一是那天 
if(dw==0) { 
tdDT = addDate(currDT,-6); 
} 
else { 
tdDT = addDate(currDT,(1-dw)); 
}

//在表格中显示一周的日期 
var objTB = document.getElementById("tb1"); 
for(var i=0;i<7;i++) {

if(tdDT.toLocaleDateString()==currDT.toLocaleDateString()) { 
objTB.rows[0].cells[i].style.color = "red"; //currDT突出显示 
}

dw = tdDT.getDay(); 
objTB.rows[0].cells[i].innerHTML = tdDT.getMonth()+1 + "月" + tdDT.getDate() + "日 星期" + aryDay[dw]; 
tdDT = addDate(tdDT,1); //下一天 
} 
}

//增加或减少若干天，由 num 的正负决定，正为加，负为减 
function addDate(dt,num) { 
var ope = "+"; 
if(num<0) { 
ope = "-"; 
}

var reDT = dt; 
for(var i=0;i<Math.abs(num);i++) { 
reDT = addOneDay(reDT,ope); 
}

return reDT; 
}

//增加或减少一天，由ope决定, + 为加，- 为减，否则不动 
function addOneDay(dt,ope) { 
var num = 0; 
if(ope=="-") { 
num = -1; 
} 
else if(ope=="+") { 
num = 1; 
}

var y = dt.getYear(); 
var m = dt.getMonth(); 
var lastDay = getLastDay(y,m);

var d = dt.getDate(); 
d += num; 
if(d<1) { 
m--; 
if(m<0) { 
y--; 
m = 11; 
} 
d = getLastDay(y,m); 
} 
else if(d>lastDay) { 
m++; 
if(m>11) { 
y++; 
m = 0; 
} 
d = 1; 
}

var reDT = new Date(); 
reDT.setYear(y); 
reDT.setMonth(m); 
reDT.setDate(d);

return reDT; 
}

//是否为闰年 
function isLeapYear(y) { 
var isLeap = false; 
if(y%4==0 && y%100!=0 || y%400==0) { 
isLeap = true; 
} 
return isLeap; 
}

//每月最后一天 
function getLastDay(y,m) { 
var lastDay = 28; 
m++; 
if(m==1 || m==3 || m==5 || m==7 || m==8 || m==10 || m==12) { 
lastDay = 31; 
} 
else if(m==4 || m==6 || m==9 || m==11) { 
lastDay = 30; 
} 
else if(isLeapYear(y)==true) { 
lastDay = 29; 
} 
return lastDay; 
} 
</script>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：JavaScript 平滑文字闪烁_文字特效Nächster Artikel：JavaScript 图片放大效果及代码说明_图象特效

In Verbindung stehende Artikel

Mehr sehen

JS 操作日期 顺便实现 上一周 和 下一周 功能_时间日期

In Verbindung stehende Artikel

JS 操作日期顺便实现上一周和下一周功能_时间日期