倒计时

2019-08-11 14:51:55 作者：互联网
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			input{width:50px;height: 20px;border:1px solid black;}
			.time1 span{display:inline-block;width:40px;height: 20px;}
		</style>

	</head>
	<body>
		<form>目的日期：
			<input type="text" id="year"><span>年</span>
			<input type="text" id="month"><span>月</span>
			<input type="text" id="day"><span>日</span>
			<input type="text" id="hour"><span>时</span>
			<input type="text" id="minute"><span>分</span>
			<input type="text" id="second"><span>秒</span>
			<input type="button" value="确定" onclick="show()">
		</form>
		<div class="time1">还剩时间：
			<span id="1"></span>天 
			<span id="2"></span>时
			<span id="3"></span>分
			<span id="4"></span>秒
		</div>

	</body>
</html>
<script>
		function show(){
			//获取目的日期
			var myyear=document.getElementById("year").value;
			var mymonth=document.getElementById("month").value-1;
			var myday=document.getElementById("day").value;
			var myhour=document.getElementById("hour").value;
			var myminute=document.getElementById("minute").value;
			var mysecond=document.getElementById("second").value;
			var time=Number(new Date(myyear,mymonth,myday,myhour,myminute,mysecond));
			// var time=new Date(myyear,mymonth,myday,myhour,myminute,mysecond).getTime();
			//获取当前时间
			var nowTime=Date.now();
			// var nowTime=new Date().getTime();
			//获取时间差
			var timediff=Math.round((time-nowTime)/1000);
			//获取还剩多少天
			var day=parseInt(timediff/3600/24);
			//获取还剩多少小时
			var hour=parseInt(timediff/3600%24);
			//获取还剩多少分钟
			var minute=parseInt(timediff/60%60);
			//获取还剩多少秒
			var second=timediff%60;
			//输出还剩多少时间
			document.getElementById("1").innerHTML=day;
			document.getElementById("2").innerHTML=hour;
			document.getElementById("3").innerHTML=minute;
			document.getElementById("4").innerHTML=second;
			setTimeout(show,1000);
			if(timediff==0){return;}
			}
	</script>
标签：value,倒计时,获取,getElementById,var,timediff,document
来源： https://www.cnblogs.com/ccyq/p/11334997.html