一、注:一般倒计时的时间都是后台传来的然后渲染到页面,这里有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中的倒计时的更多相关文章

  1. js中各种跨域问题实战小结(一)

    什么是跨域?为什么要实现跨域呢? 这是因为JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象.也就是说只能访问同一个域中的资源.我觉得这就有必要了解下javascript中的同源策略 ...

  2. JS中window.document对象

    小知识点注:外面双引号,里面的双引号改为单引号:                  在div里面行高设置和整个外面高度一样,才能用竖直居中,居中是行居中                  文本框取出来 ...

  3. 【worker】js中的多线程

    因为下个项目中要用到一些倒计时的功能,所以就提前准备了一下,省的到时候出现一下界面不友好和一些其他的事情.正好趁着这个机会也加深一下html5中的多线程worker的用法和理解. Worker简介 J ...

  4. js验证码有效时间倒计时

    js验证码有效时间倒计时 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type& ...

  5. html中实现倒计时功能(setInterval,clearInterval)

    倒计时主要用到的知识点:1.设置时间间隔的setInterval可以被clearInterval取消 2.毫秒转换为时分格式 这个是效果图 下面是js中的函数 var shijian=3600; va ...

  6. 5.0 JS中引用类型介绍

    其实,在前面的"js的六大数据类型"文章中稍微说了一下引用类型.前面我们说到js中有六大数据类型(五种基本数据类型 + 一种引用类型).下面的章节中,我们将详细讲解引用类型. 1. ...

  7. Android开发案例 – 在AbsListView中使用倒计时

    在App中, 有多种多样的倒计时需求, 比如: 在单View上, 使用倒计时, 如(如图-1) 在ListView(或者GridView)的ItemView上, 使用倒计时(如图-2) 图-1 图-2 ...

  8. 【repost】JS中的异常处理方法分享

    我们在编写js过程中,难免会遇到一些代码错误问题,需要找出来,有些时候怕因为js问题导致用户体验差,这里给出一些解决方法 js容错语句,就是js出错也不提示错误(防止浏览器右下角有个黄色的三角符号,要 ...

  9. JS中给正则表达式加变量

    前不久同事询问我js里面怎么给正则中添加变量的问题,遂写篇博客记录下.   一.字面量 其实当我们定义一个字符串,一个数组,一个对象等等的时候,我们习惯用字面量来定义,例如: var s = &quo ...

随机推荐

  1. pycharm光标变成黑框,恢复成竖线

    pycharm光标变成黑框,如下图所示 解决办法: 按外接键盘上的Insert键,即可恢复.

  2. [Umbraco] 入门教程(转)

    如在页面上显示Helloword. 设计:在umbraco里,最基础的一个概念是文档类型(document type),每个文档其实可以看成一个页面类型.比如我们要创建的两个页面,每个页面都需要显示自 ...

  3. Xamarin 绑定安卓第三方库恢复原始参数问题

    大家都知道在绑定xamarin android 第三方库的时候 参数名是乱码的 变成了p1  p2  p3 之类的 这样在实际使用的时候非常不方便. 其实xamarin是提供了三种方式帮助大家恢复ja ...

  4. 一眼看穿flatMap和map的区别

    背景 map和flatmap,从字面意思或者官网介绍,可能会给一些人在理解上造成困扰[包括本人],所以今天专门花时间来分析,现整理如下: 首先做一下名词解释---------------------- ...

  5. js中编写velocity逻辑

    <script type="text/javascript"> $(function(){ #foreach( $var in $entity.showConfigs ...

  6. Twitter Bootstrap3小结

    今天有空,小结一下Twitter Bootstrap 3的使用.首先不得不说,Bootstrap是迄今(2014)比较好的WEB设计框架(当然,其它的优秀WEB Framework还有:Foundat ...

  7. JavaScript -- FileSystemObject

    -----056-FileSystemObject.html----- <!DOCTYPE html> <html> <head> <meta http-eq ...

  8. kafka主题管理

    若代理设置了 auto.create.topics.enable=true,这样还未创建topic就往kafka发送消息时, 会自动创建一个 ${num.partitions}个分区和{default ...

  9. Mysql在linux下载、安装详情,附带mysql安装包路径

    对mysql在linux的安装网上很多,但是都比较坑人,mysql的下载.到用什么包安装,安装过程没有具体解析 我最痛苦的其实是找安装包,建议找.tar.gz安装包比较好(下面我为同胞们找到了mysq ...

  10. MathType试用期到了如何继续用

    1,卸载原来的MathType(不知道需不需要,其实删不删应该无所谓吧) 2,删除注册表中的一个值(不是默认,而是另外一个值) HKEY_CURRENT_USER\Software\Install O ...