调用方法

var _TimeCountDown = new TimeCountDown("sttime1",{
startTime:'2016-07-30 10:07:55', //开始时间
endTime:'2016-07-30 10:08:00', //结束时间
timeCallBack:"timeOverfun", //回调函数
});

countDown.js

/**
* @author wanghaitao
* @param sttime1 id
* @param startTime 开始时间
* @param endTime 结束时间
* @param timeCallBack 回调函数
*
* var _TimeCountDown = new TimeCountDown("sttime1",{
startTime:'2016-07-30 10:07:55', //开始时间
endTime:'2016-07-30 10:08:00', //结束时间
timeCallBack:"timeOverfun", //回调函数
});
*/ (function(window,undefined){
var TimeCountDown = function(container, params){
if(!(this instanceof TimeCountDown)) return new TimeCountDown(container, params); var defaults = {
endTime:'', //title
startTime:'', //请传入ID,或DOM对象
Lid:'',
leftTitle:"倒计时:",//左侧名称
colonStat:false,//是否把小时分转换成:
timeCallBack:null //关闭执行的回调函数
}
params = params || {};
var originalParams = {};
for (var param in params) { if (typeof params[param] === 'object' && params[param] !== null && !(params[param].nodeType || params[param] === window || params[param] === document || (typeof Dom7 !== 'undefined' && params[param] instanceof Dom7) || (typeof jQuery !== 'undefined' && params[param] instanceof jQuery))) {
originalParams[param] = {};
for (var deepParam in params[param]) {
originalParams[param][deepParam] = params[param][deepParam];
}
}
else {
originalParams[param] = params[param];
}
}
for (var def in defaults) {
if (typeof params[def] === 'undefined') {
params[def] = defaults[def];
}
else if (typeof params[def] === 'object') {
for (var deepDef in defaults[def]) {
if (typeof params[def][deepDef] === 'undefined') {
params[def][deepDef] = defaults[def][deepDef];
}
}
}
}
var s = this;
// Params
s.params = params;
s.container = container;
s.currentBreakpoint = undefined;
s.calculateTime = function(){
var startTime = s.vert(this.params.startTime);
var endTime = s.vert(this.params.endTime);
var time = endTime - startTime; //时间差的毫秒数 ;
return time;
}
s.vert = function(time){
if(typeof time == "undefined" || time==""){
return false;
}
var strtime = (time).replace(/-/g,"/");
var date1 = new Date(strtime);
return parseInt(date1.getTime());
}
s.nTime = s.calculateTime();
s.countdown(); }; TimeCountDown.prototype = {
countdown:function(){
var interval = 1000; //毫秒
var time;
this.nTime = this.nTime - interval; var leave1 = this.nTime;//计算天数后剩余的毫秒数
var t = Math.floor(Math.floor((leave1/(3600*1000))/24));
var hleave = this.nTime%((24*3600*1000));
//把剩余毫秒数转换为小时
var h = Math.floor(hleave/(3600*1000)) < 10 ? "0"+ Math.floor(hleave/(3600*1000)) : Math.floor(hleave/(3600*1000));
var leave2 = this.nTime%(3600*1000); //计算小时数后剩余的毫秒数
//把转换小时之后,剩余毫秒数转换为分钟
var m = Math.floor(leave2/(60*1000)) < 10 ? "0" + Math.floor(leave2/(60*1000)) : Math.floor(leave2/(60*1000)); //把转换分钟之后,剩余毫秒数转换为秒
var leave3 = leave2%(60*1000); //计算分钟数后剩余的毫秒数
var s = Math.round(leave3/1000) < 10 ? "0" + Math.round(leave3/1000) : Math.round(leave3/1000); if(!this.params.colonStat){
if(t == 0){
time = this.params.leftTitle+"<span>" + h + "</span><label>时</label><span>" + m + "</span><label>分</label><span>" + s + "</span><label>秒<label>"; }else{ time = this.params.leftTitle+"<span>" + t + "</span><label>天</label><span>" + h + "</span><label>时</label><span>" + m + "</span><label>分</label><span>" + s + "</span><label>秒<label>";
}
}else{
time = this.params.leftTitle+"<span>" + h + "</span><label>:</label><span>" + m + "</span><label>:</label><span>" + s + "</span><label><label>";
}
var callBackTime = t+h+m+s;
document.querySelector("#"+this.container).innerHTML = time;
if(callBackTime <= 0){
eval(this.params.timeCallBack);
return false;
}
var that = this;
setTimeout(function(){
that.countdown();
},interval);
}
}
window.TimeCountDown=TimeCountDown;
})(window,undefined);

  

javascript 倒计时天、小时、分钟、描述的倒计时代码的更多相关文章

  1. JavaScript秒转换成天-小时-分钟-秒

    根据时间秒转换成天-小时-分钟-秒 // 秒转换成day.hour.minutes.seconds formatSecond(second: number) { const days = Math.f ...

  2. 使用html+css+js实现倒计时,开启你痛苦的倒计时吧

    使用html+css+js实现倒计时,开启你痛苦的倒计时吧 效果图: 这是我痛苦的倒计时,呜呜呜 好啦,再痛苦还是要分享代码,代码如下,复制即可使用: <!DOCTYPE html> &l ...

  3. android实现倒计时,最简单实现RecyclerView倒计时+SwipeRefreshLayout下拉刷新

    先上效果图: RecyclerView + SwipeRefreshLayout 实现倒计时效果 MainActivity.java package top.wintp.counttimedemo1; ...

  4. MySQL 取得小时分钟部分

    MySQL 取得小时分钟部分 SELECT `CpParkID` , DATE_FORMAT( `UPDATE_TIME` , '%H:%i' )FROM `cp_park`WHERE HOUR( ` ...

  5. 【PTA】5-2 下列程序读入时间数值,将其加1秒后输出,时间格式为:hh: mm: ss,即“小时:分钟:秒”,当小时等于24小时,置为0。

    5-2 下列程序读入时间数值,将其加1秒后输出,时间格式为:hh: mm: ss,即"小时:分钟:秒",当小时等于24小时,置为0. #include <stdio.h> ...

  6. 让wordpress分类和标签的描述支持HTML代码

    默认 WordPress 后台分类和标签的编辑页面,分类和标签的描述是不支持 HTML 代码的,我们可以通过在当前主题的 functions.php 文件添加如下代码让分类和标签的描述支持 HTML ...

  7. 通过javascript库JQuery实现页面跳转功能代码

    通过javascript库JQuery实现页面跳转功能代码的四段代码实例如下. 实例1: 1 2 3 4 $(function(){ var pn = $("#gotopagenum&quo ...

  8. JavaScript与html5写的贪吃蛇完整代码

    JavaScript与html5写的贪吃蛇完整代码 查看运行效果可访问http://www.codesocang.com/texiao/youxitexiao/2014/0402/7045.html# ...

  9. Dreamweaver CS5 CS6 代码格式化、美化插件(可同一时候格式化HTML、JavaScript、CSS )眼下最好用的代码格式化扩展

    Dreamweaver CS5 CS6 代码格式化.美化插件(可同一时候格式化HTML.JavaScript.CSS )眼下最好用的代码格式化扩展. 众所周知,Dreamweaver CS5 CS6 ...

  10. 主要看思路:区域数据去重 + JavaScript一次性展示几万条数据实例代码

    近期做1功能,Gis地图 基于百度地图api , 会遇到的问题的, 如后台接口给的数据很多,大几千上万的,如果拿了数据直接渲染dom ,这滋味爽爽的. 再遇上 客户端浏览器悲催的,这卡顿就来了... ...

随机推荐

  1. CentOS 7 安装教程

    参考资料: http://www.cnblogs.com/bobbylinux/articles/centos7.html

  2. 扩展欧几里德 POJ 1061

    欧几里德的是来求最大公约数的,扩展欧几里德,基于欧几里德实现了一种扩展,是用来在已知a, b求解一组x,y使得ax+by = Gcd(a, b) =d(解一定存在,根据数论中的相关定理,证明是用裴蜀定 ...

  3. 多重背包之 HDU -1171Big Event in HDU &HDU -2191悼念512汶川大地震遇难同胞——珍惜现在,感恩生活

    这两道题都是多重背包的基础题,前面的安格题意是:给出每个物体的价值和物体的数量,如何分使得A,B所得价值最接近并且A的价值不能小于B,就类似于NYOJ上的那个邮票分你一半那个意思,只不过这里不是一个而 ...

  4. css 实现文字过长变成省略号(包含单行的and多行的)

    单行的比较简单  但是必须条件同时满足 <DIV STYLE="width: 120px; height: 50px; border: 1px solid blue;overflow: ...

  5. solr的EmbeddedSolrServer原理深入探讨

    solr的EmbeddedSolrServer原理深入探讨

  6. 使用__doPostBack函数来达到使用客户端的控件来调用服务器端的函数的--小结

    类比LinkButton按钮 LinkButton前台生成代码: JS代码: //<![CDATA[ var theForm = document.forms['form1']; if (!th ...

  7. CSS中伪类的使用

    原文:http://www.cnblogs.com/guopei/archive/2011/04/16/2017627.html 何为伪类? 也就是实际实现了类的效果,但是并没有实际添加到标签中的类, ...

  8. Centos 5.2安装配置DNS服务器

    BIND安装配置(主从)我的系统环境:centos 5.2 作者:哈密瓜 主:我采用的是yum安装[root@linux src]#yum -y install bind* 生成rndc控制命令的ke ...

  9. 常用语句1【weber出品】

    1.查看控制文件位置: select * from v$controlfile show parameter control; 2.查询日志文件位置  select group#,status,mem ...

  10. JGraph

    php中JPGraph入门配置与应用 什么是PHP JPGraph?专门提供图表的类库.它使得作图变成了一件非常简单的事情.生成非美工人士生成的图表.二维码算法. 到官方网站下载.docportal ...