<!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>