js计算当日的下一天小程序
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>计算年月日</title>
<style>
.cs{
font-size: 20px;
height: 10px;
color: red;
}
#contanel{
width:1000px;
height: 500px;
padding: 10px;
background-color: antiquewhite;
text-align: center;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
</style>
//这段本来想导入jquery，来更加简便化，但是没有使用，可以删除
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
//焦点事件，提醒用户需要登录的年分
function year(){
var showyear1=document.getElementById("showyear");
showyear1.innerHTML="请输入年份为1800-2050中的任意一年";
}
function yearblur(){
var showyear=document.getElementById("showyear");
showyear.innerHTML="";
}
function month(){
showmonth.innerHTML="请输入月份为1-12中的任意月份";
}
function monthblur(){
showmonth.innerHTML="";
}
function day(){
showday.innerHTML="请按照月份输入规定的天数";
}
function dayblur(){
showday.innerHTML="";
}
//判断输入的类型是否符合标准，是否为数字，是否在范围之内
function subclick(){
var year = Number(document.getElementById("year").value);
var month = Number(document.getElementById("month").value);
var day = Number(document.getElementById("day").value);
var showyear = document.getElementById("showyear");
var showmonth = document.getElementById("showmonth");
var showday = document.getElementById("showday");
if(year == '' || isNaN(year) || year < 1800 || year >2050){
showyear.innerHTML="输入不能为空 or 年份只可以输入数字类型 or 年在1800-2050之间";
}else if(month == '' || isNaN(month) || month < 1 || month > 12){
showmonth.innerHTML="输入不能为空 or 月份只可以输入数字类型 or 月份只有1-12月";
}else if(month == 1 || month == 3 || month == 5 || month == 7 || month == 8 || month == 10 || month == 12){
if(day == '' || isNaN(day) || day < 1 || day > 31){
showday.innerHTML="输入不能为空 or 天数只可以输入数字类型 or 最多31天";
return;
}
}else if(month == 4 || month == 6 || month == 9 || month == 11){
if(day == '' || isNaN(day) || day < 1 || day > 30){
showday.innerHTML="输入不能为空 or 天数只可以输入数字类型or 最多30天";
return;
}
}else if(month == 2){
if((year % 4==0 && year % 100 != 0) || year % 400 == 0){
if(day == '' || isNaN(day) || day < 1 || day > 29){
showday.innerHTML="输入不能为空 or 天数只可以输入数字类型 or 闰年最多28天";
return;
}
}else{
if(day == '' || isNaN(day) || day < 1 || day > 28){
showday.innerHTML="输入不能为空 or 天数只可以输入数字类型 or 平年最多29天";
return;
}
}
}
setdate(year , month , day);
}
//计算输入日期输出结果，考虑到多种情况
function setdate(year , month , day){
var result = document.getElementById("result");
if(month == 1 || month == 3 || month == 5 || month == 7 || month == 8 || month == 10 || month == 12){
if(day == 31){
if(month == 12){
year += 1 ;
month = 1 ;
day = 1 ;
document.getElementById("result").value=year + "年" + month + "月" + day+"日";
}else{
month += 1 ;
day = 1 ;
document.getElementById("result").value=year + "年" + month + "月" + day+"日";
}
}else{
day += 1 ;
document.getElementById("result").value=year + "年" + month + "月" + day+"日";
}
}else if(month == 4 || month == 6 || month == 9 || month == 11){
if(day == 30){
if(month == 12){
year += 1 ;
month = 1 ;
day = 1 ;
document.getElementById("result").value=year + "年" + month + "月" + day+"日";
}else{
month += 1 ;
day = 1 ;
document.getElementById("result").value=year + "年" + month + "月" + day+"日";
}
}else{
day += 1 ;
document.getElementById("result").value=year + "年" + month + "月" + day+"日";
}
}else if(month == 2){
if((year % 4==0 && year % 100 != 0) || year % 400 == 0){
if(day == 29){
if(month == 12){
year += 1 ;
month = 1 ;
day = 1 ;
document.getElementById("result").value=year + "年" + month + "月" + day+"日";
}else{
month += 1 ;
day = 1 ;
document.getElementById("result").value=year + "年" + month + "月" + day+"日";
}
}else{
day += 1 ;
document.getElementById("result").value=year + "年" + month + "月" + day+"日";
}
}else{
if(day == 28){
if(month == 12){
year += 1 ;
month = 1 ;
day = 1 ;
document.getElementById("result").value=year + "年" + month + "月" + day+"日";
}else{
month += 1 ;
day = 1 ;
document.getElementById("result").value=year + "年" + month + "月" + day+"日";
}
}else{
day += 1 ;
document.getElementById("result").value=year + "年" + month + "月" + day+"日";
}
}
}
}
//点击重置按钮清空
function reset(){
var year = document.getElementById("year");
var month = document.getElementById("month");
var day = document.getElementById("day");
year.value='';
month.value='';
day.value='';
}
</script>
</head>
<body>
//构建小页面
<div id="contanel">
<div style="background:yellow; height: 100px; margin-top: -50px;width:1000px;line-height:100px;font-size: 50px">计算下一天的小程序</div>
年:<input type="text" id="year" onblur="yearblur()" onfocus="year()"/>
<div id="showyear" style="width:1000px;height:30px;" class="cs">
</div>
<br />
月:<input type="text" id="month" onfocus="month()" onblur="monthblur()"/>
<div id="showmonth" style="width:1000px;height:30px;" class="cs">
</div>
<br />
日:<input type="text" id="day" onfocus="day()" onblur="dayblur()" />
<div id="showday" style="width:1000px;height:30px;" class="cs">
</div>
<input type="button" value="提交" onclick="subclick()" style="width:100px;height:30px"/>
<br />//鼠标点击事件
这一天的下一天为:<br />
<input id="result">
<input onclick="reset()" type="button" value="重置" >
</div>
</body>
</html>
此程序使用js来实现功能模块，里面包含鼠标点击事件，鼠标焦点事件，当不符合功能的时候就不能提交，用许多if判断语句来编写，考虑到多种情况。恩，就这样。