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 ,这滋味爽爽的. 再遇上 客户端浏览器悲催的,这卡顿就来了... ...
随机推荐
- js截取字符串区分汉字字母代码
js截取字符串并且区分汉字字母,一个汉字辨别为两个字节. function substr(str, len) { if (!str || !len) { return ''; } // 预期计数:中文 ...
- Mosquitto安装_Ubuntu/Debian上安装消息队列Mosquitto
Mosquitto安装_Ubuntu/Debian上安装消息队列Mosquitto MQTT是IBM开发的一个即时通讯协议.MQTT是面向M2M和物联网的连接协议,采用轻量级发布和订阅消息传输机制.M ...
- divmod(a,b)函数
python每日一函数 - divmod数字处理函数 divmod(a,b)函数 中文说明: divmod(a,b)方法返回的是a//b(除法取整)以及a对b的余数 返回结果类型为tuple 参数: ...
- css09浮动属性
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- 排序算法之奇偶排序 JAVA奇偶排序算法
奇偶排序法的思路是在数组中重复两趟扫描.第一趟扫描选择所有的数据项对,a[j]和a[j+1],j是奇数(j=1, 3, 5……).如果它们的关键字的值次序颠倒,就交换它们.第二趟扫描对所有的偶数数据项 ...
- sql 判断表、列、视图等是否存在
1 判断数据库是否存在 if exists (select * from sys.databases where name = '数据库名') drop database [数据库名] 2 判 ...
- Cacti添加IO模板并监控磁盘IO
1.下载Cacti_Net-SNMP_DevIO_v3.1.zip 下载Cacti_Net-SNMP_DevIO_v3.1.zip,解压并上传net-snmp_devio.xml到/resource/ ...
- Jenkins学习之——(4)Email Extension Plugin插件的配置与使用
1.先安装插件 2.配置 点击高级后 内容配置: 3.项目配置 点击Advanced Settings后 到此所有的配置都设置完成. 附录: 以下内容来自其他网友的博客,内容也没有自己去试,朋友们可以 ...
- xcode 删除 Provisioning Profile
provisioning profile path: ~/Library/MobileDevice/Provisioning Profiles 打开并日期排序,删除老的 provisioning pr ...
- php pdo_mysql使用方法
<?php $dsn='mysql:host=127.0.0.1;port=3306;dbname=bisai'; $username='root'; $password=''; $driver ...