倒计时插件与函数

谁借莪１个温暖的怀抱￠ 2022-09-15 12:47 135阅读 0赞

## （1）使用倒计时函数 ##

const countDown = (current, ends) => {
        const leftTime = ends - current;
        let [h, m, s] = ['00', '00', '00'];
        if (leftTime >= 0) {
          h =
            Math.floor((leftTime / 1000 / 60 / 60) % 24) >= 10
              ? Math.floor((leftTime / 1000 / 60 / 60) % 24)
              : `0${Math.floor((leftTime / 1000 / 60 / 60) % 24)}`;
          m =
            Math.floor((leftTime / 1000 / 60) % 60) >= 10
              ? Math.floor((leftTime / 1000 / 60) % 60)
              : `0${Math.floor((leftTime / 1000 / 60) % 60)}`;
          s =
            Math.floor((leftTime / 1000) % 60) >= 10
              ? Math.floor((leftTime / 1000) % 60)
              : `0${Math.floor((leftTime / 1000) % 60)}`;
        }
        setTimeout(countDown, 1000);
      };

函数接收两个参数，当前时间和结束时间（使用毫秒）。调用一次后，时间会开始倒计时~  
 使用场景：PC，移动均适用

## （2）使用倒计时插件 ##

import Countdown from 'rax-countdown';
    
     const onComplete = () => {
      console.log('countdown complete');
     };
    
     <Countdown
      timeRemaining={parseInt(v.starts) - parseInt(v.current)}
      tpl={'{h}:{m}:{s}'}
      onComplete={onComplete}
     />

使用插件，参数当前时间和结束时间（使用毫秒）。调用一次后，时间会开始倒计时~  
使用场景：rax组件

发表评论取消回复

表情：

评论列表（有 0 条评论，135人围观）

还没有评论，来说两句吧...

相关阅读

相关倒计时纯js插件

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

红太狼/ 2023年06月12日 09:06/ 0 赞/ 108 阅读

相关 2倒计时插件_11款免费又好用的PPT倒计时神器

![3f700ed7b08c9d2da21e219f5999443c.gif][] 你好，我是充哥！倒计时是PPT 中一种很常见的应用，小到会议演说，大到舞会开场，都有它

ゝ一纸荒年。/ 2023年01月07日 03:48/ 0 赞/ 3654 阅读

相关倒计时插件与函数

（1）使用倒计时函数 const countDown = (current, ends) => { const leftTime = ends -

谁借莪１个温暖的怀抱￠/ 2022年09月15日 12:47/ 0 赞/ 136 阅读

相关漂亮实用的jQuery倒计时插件特效代码

原文：[漂亮实用的jQuery倒计时插件特效代码][jQuery] 源代码下载地址：[http://www.zuidaima.com/share/17995988756756

蔚落/ 2022年08月23日 04:59/ 0 赞/ 195 阅读

相关倒计时

验证输入手机号验证码倒计时 ![这里写图片描述][SouthEast]![这里写图片描述][SouthEast 1] \如上图所示要实现验证码的倒计时的效果

不念不忘少年蓝@/ 2022年06月02日 10:12/ 0 赞/ 342 阅读

相关 Vue.js 插件开发：透明提示框插件、倒计时返回首页插件

在做项目时开发了两个插件，一个是透明提示框、另一个是长时间不操作自动返回首页的插件，在这里分享一下。一、网页透明提示框插件 1.效果（支持同时弹出多个

╰+攻爆jí腚メ/ 2022年05月30日 05:54/ 0 赞/ 304 阅读

相关倒计时插件

[2019独角兽企业重金招聘Python工程师标准>>> ][2019_Python_] ![hot3.png][] 当想下载某个文件的之前，会有三到五秒的等待时间，

我会带着你远行/ 2022年01月14日 14:01/ 0 赞/ 215 阅读

相关倒计时

js代码 var EndTime= new Date('2017/2/18 00:00:00'); //设置到期时间 var NowTime = ne

- 日理万妓/ 2021年12月23日 08:41/ 0 赞/ 473 阅读

相关 vue-倒计时控件

好久木有来更新了，最近几个月把精力都花费在了加班上~ 最近用vue整前端有个倒计时控件的需求，用element-ui满足不了需求，便模仿常见的倒计时效果，写了一个控件，有需要

素颜马尾好姑娘i/ 2021年09月24日 06:18/ 0 赞/ 446 阅读

相关活动倒计时封装函数

直接贴代码 //e:结束的时间,是一个时间戳类似156654646545 //obj:放置倒计时的dom节点 //skin:倒计时的格式''ww_1'

骑猪看日落/ 2021年09月14日 13:22/ 0 赞/ 372 阅读