JS中的倒计时
一、注:一般倒计时的时间都是后台传来的然后渲染到页面,这里有2个简单的倒计时方式
//带天数的倒计时
function countDown(times){
var timer=null;
timer=setInterval(function(){
var day=0,
hour=0,
minute=0,
second=0;//时间默认值
if(times > 0){
day = Math.floor(times / (60 * 60 * 24));
hour = Math.floor(times / (60 * 60)) - (day * 24);
minute = Math.floor(times / 60) - (day * 24 * 60) - (hour * 60);
second = Math.floor(times) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
}
if (day <= 9) day = '0' + day;
if (hour <= 9) hour = '0' + hour;
if (minute <= 9) minute = '0' + minute;
if (second <= 9) second = '0' + second;
//
console.log(day+"天:"+hour+"小时:"+minute+"分钟:"+second+"秒");
times--;
},1000);
if(times<=0){
clearInterval(timer);
}
}
//单纯分钟和秒倒计时
function resetTime(time){
var timer=null;
var t=time;
var m=0;
var s=0;
m=Math.floor(t/60%60);
m<10&&(m='0'+m);
s=Math.floor(t%60);
function countDown(){
s--;
s<10&&(s='0'+s);
if(s.length>=3){
s=59;
m="0"+(Number(m)-1);
}
if(m.length>=3){
m='00';
s='00';
clearInterval(timer);
}
console.log(m+"分钟"+s+"秒");
}
timer=setInterval(countDown,1000);
}
二、如何使用


JS中的倒计时的更多相关文章
- js中各种跨域问题实战小结(一)
		什么是跨域?为什么要实现跨域呢? 这是因为JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象.也就是说只能访问同一个域中的资源.我觉得这就有必要了解下javascript中的同源策略 ... 
- JS中window.document对象
		小知识点注:外面双引号,里面的双引号改为单引号: 在div里面行高设置和整个外面高度一样,才能用竖直居中,居中是行居中 文本框取出来 ... 
- 【worker】js中的多线程
		因为下个项目中要用到一些倒计时的功能,所以就提前准备了一下,省的到时候出现一下界面不友好和一些其他的事情.正好趁着这个机会也加深一下html5中的多线程worker的用法和理解. Worker简介 J ... 
- js验证码有效时间倒计时
		js验证码有效时间倒计时 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type& ... 
- html中实现倒计时功能(setInterval,clearInterval)
		倒计时主要用到的知识点:1.设置时间间隔的setInterval可以被clearInterval取消 2.毫秒转换为时分格式 这个是效果图 下面是js中的函数 var shijian=3600; va ... 
- 5.0 JS中引用类型介绍
		其实,在前面的"js的六大数据类型"文章中稍微说了一下引用类型.前面我们说到js中有六大数据类型(五种基本数据类型 + 一种引用类型).下面的章节中,我们将详细讲解引用类型. 1. ... 
- Android开发案例 – 在AbsListView中使用倒计时
		在App中, 有多种多样的倒计时需求, 比如: 在单View上, 使用倒计时, 如(如图-1) 在ListView(或者GridView)的ItemView上, 使用倒计时(如图-2) 图-1 图-2 ... 
- 【repost】JS中的异常处理方法分享
		我们在编写js过程中,难免会遇到一些代码错误问题,需要找出来,有些时候怕因为js问题导致用户体验差,这里给出一些解决方法 js容错语句,就是js出错也不提示错误(防止浏览器右下角有个黄色的三角符号,要 ... 
- JS中给正则表达式加变量
		前不久同事询问我js里面怎么给正则中添加变量的问题,遂写篇博客记录下. 一.字面量 其实当我们定义一个字符串,一个数组,一个对象等等的时候,我们习惯用字面量来定义,例如: var s = &quo ... 
随机推荐
- [leetcode.com]算法题目 - Remove Duplicates from Sorted List
			Given a sorted linked list, delete all duplicates such that each element appear only once. For examp ... 
- Python3.5 学习二十
			学会用三种方法检索数据 1.对象方式 2.字典方式 3.元组方式 models后面,如果是.values() 则为字典方式 如果是value_list() 则为元组方式 跨表操作时,如果是对象,可以用 ... 
- UVA10829 L-Gap Substrings(后缀数组+ST表)
			后缀数组+ST表. 代填的坑. \(Code\ Below:\) #include <bits/stdc++.h> #define ll long long using namespace ... 
- spark踩坑——dataframe写入hbase连接异常
			最近测试环境基于shc[https://github.com/hortonworks-spark/shc]的hbase-connector总是异常连接不到zookeeper,看下报错日志: 18/06 ... 
- Python上下文管理协议:__enter__和__exit__
			上下文管理器(context manager)是Python2.5开始支持的一种语法,用于规定某个对象的使用范围.一旦进入或者离开该使用范围,会有特殊操作被调用 (比如为对象分配或者释放内存).它的语 ... 
- 文件压缩小项目haffman压缩
			文件压缩的原理: 文件压缩总体可以分为有损压缩和无损压缩两类,有损压缩是指对mp3等格式的文件,忽略一些无关紧要的信息,只保留一些关键的信息,但并不因此影响用户对于这些mp3格式文件的体验度,无损压缩 ... 
- python 生成器 迭代器
			阅读目录 一 递归和迭代 二 什么是迭代器协议 三 python中强大的for循环机制 四 为何要有for循环 五 生成器初探 六 生成器函数 七 生成器表达式和列表解析 八 生成器总结 一 递归和迭 ... 
- office2013安装与卸载
			一.office2013卸载不干净,重新安装的时候就会报错.下面是博主卸载的步骤: 第一步:下载office官方卸载工具 ,链接:http://pan.baidu.com/s/1nvuoEYd 密码: ... 
- java和js获取当前天之后或之前7天(任意)日期
			一.获取过去第几天的日期(- 操作) 或者 未来 第几天的日期( + 操作) /** * 获取过去第几天的日期(- 操作) 或者 未来 第几天的日期( + 操作) * * @param past * ... 
- ElasticSearch  6.x 父子文档[join]分析
			ES6.0以后,索引的type只能有一个,使得父子结构变的不那么清晰,毕竟对于java开发者来说,index->db,type->table的结构比较容易理解. 按照官方的说明,之前一个索 ... 
