代码:

js:

function countDown(time, id) {  //time的格式yyyy/MM/dd hh:mm:ss
    var day_elem = $(id).find('.day');
    var hour_elem = $(id).find('.hour');
    var minute_elem = $(id).find('.minute');
    var second_elem = $(id).find('.second');
    var end_time = new Date(time).getTime(), //月份是实际月份-1
    sys_second = (end_time - new Date().getTime()) / 1000;
    var timer = setInterval(function () {
        if (sys_second > 1) {
            sys_second -= 1;
            var day = Math.floor((sys_second / 3600) / 24);
            var hour = Math.floor((sys_second / 3600) % 24);
            var minute = Math.floor((sys_second / 60) % 60);
            var second = Math.floor(sys_second % 60);
            day_elem && $(day_elem).text(day); //计算天
            $(hour_elem).text(hour < 10 ? "0" + hour : hour); //计算小时
            $(minute_elem).text(minute < 10 ? "0" + minute : minute); //计算分钟
            $(second_elem).text(second < 10 ? "0" + second : second); //计算秒杀
        } else {
            clearInterval(timer);
        }
    }, 1000);
}

html:

  <p id="colockbox">
              <span class="day" id="day">00</span>

     <span class="hour">00</span>:

<span  class="minute">24</span>:

     <span class="second">24</span>
      </p>

jquery时间倒计时相关推荐

  1. jquery实现倒计时

    1 <html> 2 <head> 3 <meta charset="utf-8"/> 4 <title>jquery实现倒计时&l ...

  2. jq倒计时html源码,jQuery实现倒计时功能

    定义和用法 setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式. setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被 ...

  3. jquery.countdown 倒计时插件的学习

    1.第一种简单的使用 第一个时间是你的倒计时截止时间,finalDate格式可以是YYYY/MM/DD MM/DD/YYYY YYYY/MM/DD hh:mm:ss MM/DD/YYYY hh:mm: ...

  4. html5在线天数计时器,HTML倒计时效果:天、时、分、秒 | 固定时间倒计时

    需求分析: 希望制作一个固定时间倒计时效果,比如某某活动在4小时之后结束,点开网页,触发倒计时事件,开始4小时倒计时.考虑使用setInterval定时器,在时间为0后,clearInterval清除 ...

  5. jQuery实现倒计时效果

    <script type="text/javascript">/*@用途:jQuery实现倒计时效果$(".time").countDown({ti ...

  6. 推荐5款实用的jQuery时间轴插件

    1.使用CSS3和jQuery制作的水平时间轴 这是一个可以在PC和移动端表现非常棒的水平时间轴,它由上部水平滑块和下部时间点对应的内容区块,点击时间轴上的时间点,下部内容会滑动到对应的内容区块.使用 ...

  7. jQuery时间轴特效

    一 timelinr 图图: 码码: <!DOCTYPE html> <html> <head> <meta http-equiv="Content ...

  8. 倒计时或按任意键返回首页_超实用excel小技巧之时间倒计时及动态显示

    一寸光阴一寸金,寸金难买寸光阴.浪费时间就等于浪费生命,所以时间的重要性不言而喻.我们经常会为一些重要的日子倒计时,准备着重要时刻的来临,例如考试,纪念日等. 我在这里设置现在到国庆节日的时间倒计时, ...

  9. jQuery自适应倒计时插件

    jQuery自适应倒计时插件 在线演示本地下载 更多专业前端知识,请上 [猿2048]www.mk2048.com

  10. js,jQuery时间与时间戳相互转换

    js,jQuery时间与时间戳相互转换 一.时间转时间戳 //获取当前时间 var myDate = new Date(); //获取当前时间(从1970.1.1开始的毫秒数,时间戳) myDate. ...

最新文章

  1. Web 前端,易学难精,没有拿手的实战项目,怎么办?
  2. python学成什么样可以找工作-Python 爬虫学到什么样就可以找工作了?
  3. syslog-ng 正确配置udp接受端口
  4. android后台获取view,android – 如何获取当前显示在AdapterView中的项目?
  5. MFC单选按钮的使用
  6. 数据科学之:消费者资产分析
  7. 计算机应用决策支持系统,计算机决策支持系统技术及应用研究
  8. 程序员如何从技术上“开挂”魔卡手游? | 技术头条
  9. Failed to start OpenLDAP Server Daemon
  10. 在腾讯实习的那段日子:不要在难受的时候选择 '逃避/离开'
  11. 50位中国女性科学家入选2022福布斯
  12. (生物信息学)R语言与统计学入门(九)—— 单因素cox回归分析
  13. 从 IT 的角度思考 BIM(一):面向对象
  14. 关键词优化推广需要怎么做?有哪些方法和技巧
  15. SQL Server报错:Arithmetic overflow error converting expression to data type int.
  16. Elasticsearch基础11——索引之别名使用
  17. 靶机渗透练习07-HackMyVm Area51 (Log4j2复现)
  18. Video标签的基本使用
  19. 通过adb命令更改手机屏幕比例
  20. 【计算机二级Python】模拟试卷第6套选择题

热门文章

  1. FZU 1924——死锁——————【topo判环】
  2. 医学图像填洞处理-image fill holes
  3. python_tornado
  4. Python Day2
  5. angular 个人零点学习
  6. vs2013 c++代码内出现中文导致编译错误
  7. 桑心啊,ListT.FindAll()的效率竟然比for循环还差。
  8. 业务需求访谈中需要注意的重要法则(转)
  9. Ubuntu8.04安置XCrysDen
  10. JavaMail操作的总结(2)