用js实现倒计时和在页面显示当前时间

最新推荐文章于 2024-07-02 12:22:49 发布

Java刺客

最新推荐文章于 2024-07-02 12:22:49 发布

阅读量3.2k

点赞数

分类专栏：代码案例记录

本文链接：https://blog.csdn.net/u010121228/article/details/52598287

版权

代码案例记录专栏收录该内容

19 篇文章 0 订阅

订阅专栏

用js倒计时的实现 和 在页面显示当前时间

<!DOCTYPE html>
<html>
	<head>
		
		<meta charset="utf-8" />
		<title></title>
		<script type="text/javascript" src="js/jquery-3.1.0.min.js" ></script>
		<script>
	<span style="white-space:pre">	</span>window.onload = function(){
			setInterval(function(){	
				getTime();
		},1000);
		}
		
		function FormatDate (strTime) {
 		 var date = new Date(strTime);
 		return date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate()+" "+date.getHours()+":"+date.getMinutes()+":"+date.getSeconds();   				}
		function getTime(){
			document.getElementById("time").innerHTML = FormatDate(Date());
		}
		</script>
		<script>
		 // 自定义倒计时函数 
		 function myTimer() { var time = jisuanTime(); 
		 	// 设置倒计时的时间 
		 	var InterValObj; 
		 	InterValObj = window.setInterval(setTime, 1000);
		 	function setTime() { 
		 		if (time > 0)
		 		{
		 			time = time - 1;
		 			var second = Math.floor(time % 60); 
		 			// 计算秒 
		 			var minite = Math.floor((time / 60) % 60); 
		 			//计算分
		 			var hour = Math.floor((time / 3600) % 24); 
		 			var day = Math.floor((time / 3600) / 24);
		 			$("#ggtitle").text('距离正式开放大约还有'+day+'天'+hour+'小时'+minite+'分'+second+'秒'); 
		 		} else { 
		 			//剩余时间小于或等于0的时候，就停止间隔函数 
		 			window.clearInterval(InterValObj); 
		 			//这里可以添加倒计时时间为0后需要执行的事件
		 			$("#ggtitle").text('网站马上开放');
		 		} 
		 	};
		 }; 
		 function jisuanTime () 
		 { 
		 	var nowtime=new Date(); 
		 	var mtime=new Date('2016/10/07'); 
		 	var s=mtime.getTime()-nowtime.getTime(); 
		 	return s/1000; 
		 }; 
		 
		 $(document).ready(function () 
		 { 
		 	myTimer(); 
		 });
		</script>

	</head>
	<body>
		<div id="ggtitle" style="color:red"></div>
		<div id="time" style="color:red"></div>
	</body>
</html>