倒计时

碵蝎

于 2016-08-18 12:16:11 发布

阅读量291

点赞数

分类专栏：旧技术

本文链接：https://blog.csdn.net/QQ408896436/article/details/52239771

版权

旧技术专栏收录该内容

28 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="gbk">
<title>倒计时demo</title>	
<style>
	*{margin: 0; padding: 0;}
</style>
</head>
<body>
<div>
	<p class='countdown'>剩余：
		<span id='dd'>0</span>天
		<span id='hh'>0</span>小时
		<span id='ms'>0</span>分
		<span id='ss'>0</span>秒
	</p>
</div>
<div>
	<p class='countdown'>剩余：
		<span id='dd2'>0</span>天
		<span id='hh2'>0</span>小时
		<span id='ms2'>0</span>分
		<span id='ss2'>0</span>秒
	</p>
</div>
<script>

    function LCDate(obj)
    {	
    	this.config = {};

    	for(var i in obj){
    		this.config[i] = obj[i]
    	}

    	this.DifferenceHour = -1;
	    this.DifferenceMinute = -1;
	    this.DifferenceSecond = -1;
	    this.Tday = new Date(this.config['data']); 
	    this.daysms = 24 * 60 * 60 * 1000;
	    this.hoursms = 60 * 60 * 1000;
	    this.Secondms = 60 * 1000;
	    this.microsecond = 1000;
	    var self = this;
	    
	    this.setClock = function()
	    {
	    	var time = new Date();
	        var hour = time.getHours();
	        var minute = time.getMinutes();
	        var second = time.getSeconds();
	        var timevalue = "" + ((hour > 12) ? hour - 12 : hour);
	        timevalue += ((minute < 10) ? ":0" : ":") + minute;
	        timevalue += ((second < 10) ? ":0" : ":") + second;
	        timevalue += ((hour > 12) ? " PM" : " AM");
	        var convertHour = self.DifferenceHour;
	        var convertMinute = self.DifferenceMinute;
	        var convertSecond = self.DifferenceSecond;
	        var Diffms = self.Tday.getTime() - time.getTime();
	        self.DifferenceHour = Math.floor(Diffms / self.daysms);
	        Diffms -= self.DifferenceHour * self.daysms;
	        self.DifferenceMinute = Math.floor(Diffms / self.hoursms);
	        Diffms -= self.DifferenceMinute * self.hoursms;
	        self.DifferenceSecond = Math.floor(Diffms / self.Secondms);
	        Diffms -= self.DifferenceSecond * self.Secondms;
	        var dSecs = Math.floor(Diffms / self.microsecond);
	        if (convertHour != self.DifferenceHour) document.getElementById(self.config['day']).innerHTML = self.DifferenceHour;
	        if (convertMinute != self.DifferenceMinute) document.getElementById(self.config['hour']).innerHTML = self.DifferenceMinute;
	        if (convertSecond != self.DifferenceSecond) document.getElementById(self.config['min']).innerHTML = self.DifferenceSecond <10? '0'+self.DifferenceSecond : self.DifferenceSecond;
	        document.getElementById(self.config['sec']).innerHTML = dSecs<10? '0' + dSecs : dSecs;
	        self.updates();
	    },

	    this.updates = function()
	    {
	    	window.setTimeout(this.setClock, 1000);
	    }
    }

    new LCDate({
    	'data' : '2016/08/18 12:15:00', //倒计时的格式
    	'day' : 'dd', //显示天数的id
    	'hour' : 'hh', //显示小时的id
    	'min' : 'ms', //显示分钟的id
    	'sec' : 'ss' //显示秒数的id
    }).setClock();


     new LCDate({
    	'data' : '2016/08/18 12:45:21',
    	'day' : 'dd2',
    	'hour' : 'hh2',
    	'min' : 'ms2',
    	'sec' : 'ss2'
    }).setClock();

</script>
</body>
</html>

碵蝎

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
倒计时

<!DOCTYPE html><html lang="zh-CN"><head><meta charset="gbk"><title>倒计时demo</title> <style> *{margin: 0; padding: 0;}</style></head><b...
复制链接

扫一扫

专栏目录