javascript 倒计时天、小时、分钟、描述的倒计时代码
调用方法
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 倒计时天、小时、分钟、描述的倒计时代码的更多相关文章
- JavaScript秒转换成天-小时-分钟-秒
根据时间秒转换成天-小时-分钟-秒 // 秒转换成day.hour.minutes.seconds formatSecond(second: number) { const days = Math.f ...
- 使用html+css+js实现倒计时,开启你痛苦的倒计时吧
使用html+css+js实现倒计时,开启你痛苦的倒计时吧 效果图: 这是我痛苦的倒计时,呜呜呜 好啦,再痛苦还是要分享代码,代码如下,复制即可使用: <!DOCTYPE html> &l ...
- android实现倒计时,最简单实现RecyclerView倒计时+SwipeRefreshLayout下拉刷新
先上效果图: RecyclerView + SwipeRefreshLayout 实现倒计时效果 MainActivity.java package top.wintp.counttimedemo1; ...
- MySQL 取得小时分钟部分
MySQL 取得小时分钟部分 SELECT `CpParkID` , DATE_FORMAT( `UPDATE_TIME` , '%H:%i' )FROM `cp_park`WHERE HOUR( ` ...
- 【PTA】5-2 下列程序读入时间数值,将其加1秒后输出,时间格式为:hh: mm: ss,即“小时:分钟:秒”,当小时等于24小时,置为0。
5-2 下列程序读入时间数值,将其加1秒后输出,时间格式为:hh: mm: ss,即"小时:分钟:秒",当小时等于24小时,置为0. #include <stdio.h> ...
- 让wordpress分类和标签的描述支持HTML代码
默认 WordPress 后台分类和标签的编辑页面,分类和标签的描述是不支持 HTML 代码的,我们可以通过在当前主题的 functions.php 文件添加如下代码让分类和标签的描述支持 HTML ...
- 通过javascript库JQuery实现页面跳转功能代码
通过javascript库JQuery实现页面跳转功能代码的四段代码实例如下. 实例1: 1 2 3 4 $(function(){ var pn = $("#gotopagenum&quo ...
- JavaScript与html5写的贪吃蛇完整代码
JavaScript与html5写的贪吃蛇完整代码 查看运行效果可访问http://www.codesocang.com/texiao/youxitexiao/2014/0402/7045.html# ...
- Dreamweaver CS5 CS6 代码格式化、美化插件(可同一时候格式化HTML、JavaScript、CSS )眼下最好用的代码格式化扩展
Dreamweaver CS5 CS6 代码格式化.美化插件(可同一时候格式化HTML.JavaScript.CSS )眼下最好用的代码格式化扩展. 众所周知,Dreamweaver CS5 CS6 ...
- 主要看思路:区域数据去重 + JavaScript一次性展示几万条数据实例代码
近期做1功能,Gis地图 基于百度地图api , 会遇到的问题的, 如后台接口给的数据很多,大几千上万的,如果拿了数据直接渲染dom ,这滋味爽爽的. 再遇上 客户端浏览器悲催的,这卡顿就来了... ...
随机推荐
- Java基础知识强化75:正则表达式之分割功能(字符串中的数字排序案例)
1. 案例分析: 我有如下一个字符串:"91 27 46 38 50" 写代码实现最终输出结果是:"27 38 46 50 91" 分析: (1)定义一个 ...
- Webpack 基本环境搭建
1. 第一步安装之前 先npm init 创建 package.json cnpm init; 然后全局安装 cnpm install webpack -g 确保哪里都可以使用 cnpm instal ...
- Linux基础知识之 系统启动流程
[1]Linux启动的几个主要阶段 启动流程示意图
- C# 窗口传值的方法
方法一: A to B 设置FormB 为 带参数的构造函数 public Form2( object msg) { InitializeComponent(); } 方法二: A to B 定义一 ...
- CSS选择符详解之关系选择符篇
原文:http://www.chinaz.com/web/2012/1017/278553.shtml 相信大家都对CSS选择符都不陌生,选择符包含:元素选择符.关系选择符.属性选择符.伪类选择符.伪 ...
- Cacti添加Advance Ping监控模板
Cacti脚本 1.Advance Ping 脚本及模板 注:要使用此模板,编译PHP时必须加上--enable-sockets选项来支持套接字. 1).功能:此模板用来监控一个TCP/U ...
- 单点登录CAS使用记(三):实现自定义验证用户登录
问题: CAS自带的用户验证逻辑太过简单,如何像正常网站一样,通过验证DB中的用户数据,来验证用户以及密码的合法性呢? 方案1:CAS默认的JDBC扩展方案: CAS自带了两种简单的通过JDBC方式验 ...
- MOOTOOLS简单操作应用知识
在项目中我们经常需要用到全选/反选.等操作按钮. 基于mootools框架与jquery框架不一致.导致缓慢. $('chkall').addEvent('click',function(){ if( ...
- C#泛型理解(转)
[译]C# 理解泛型 PDF 浏览:http://www.tracefact.net/document/generics-in-csharp.pdf源码下载:http://www.tracefact ...
- OpenStack JEOS 镜像
JEOS:Just Enough Operating System 维基百科地址:http://en.wikipedia.org/wiki/Just_enough_operating_system O ...