代码:

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. js时间倒计时

    看了网上的其他的例子,觉得写的都有点复杂,不好理解,于是自己动手写了个. 本来想封装成jquery插件,但是觉得因为功能很简单,没有必要做成jquery插件,引用的时候不需要引入jqery库,这里直接 ...

  2. jQuery实现倒计时效果-杨秀徐

    本实例效果:剩余368天22小时39分57秒结束 代码简单易懂,适用各种倒计时: <!DOCTYPE html> <head> <title>jQuery实现倒计时 ...

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

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

  4. jquery实现倒计时

    <html> <head> <meta charset="utf-8"/> <title>jquery实现倒计时</title ...

  5. jQuery控制倒计时

    1.1 秒杀的倒计时 做秒杀网页总免不了倒计时,但没有很好的服务器,啥资源都没有,只能将部分任务交给浏览器去处理,比如秒杀首页的倒计时,因为真正秒杀是在具体页面,首页只是展示而已,所以误差一点是允许的 ...

  6. jquery时间轴幻灯展示源代码

    查看效果:http://hovertree.com/texiao/jquery/75/ 源代码下载:http://hovertree.com/h/bjaf/8jlpc2wu.htm 效果图如下: 代码 ...

  7. jQuery时间格式插件-moment.js的使用

    jQuery时间格式插件-moment.js的使用 moment.js插件的使用,使用之前在页面引入对应的js文件: 详细的操作可见moment中文官网:http://momentjs.cn/ 日期格 ...

  8. jQuery时间轴插件timeline.js

    http://www.jq22.com/jquery-info13695 http://www.jq22.com/jquery-info13357 简要教程 timeline.js是一款jQuery时 ...

  9. 发展简史jQuery时间轴特效

    发展简史jQuery时间轴特效.这是一款鼠标滚动到一定的高度动画显示企业发展时间轴特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class="wr ...

随机推荐

  1. poj 2239 Selecting Courses (二分匹配)

    Selecting Courses Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 8316   Accepted: 3687 ...

  2. Selenium2+python自动化2-pip降级selenium3.0

    selenium版本安装后启动Firefox出现异常:'geckodriver' executable needs to be in PATH selenium默默的升级到了3.0,然而网上的教程都是 ...

  3. 新创建的项目利用git添加远程仓库

    git initgit remote add origin https:// //git账号中的网址 (git remote //可以查询添加的远程仓库) git add . //添加刚刚导入的整个工 ...

  4. BDC批导数据

    1.输入事务代码SHBD进入以下界面: 点击新建记录,创建一个新的BDC录屏记录, 然后根据记录条件进行 BDC录屏代码 perform fill_bdc using ANLKL. call tran ...

  5. 【golang】go语言,进行并发请求的wrap变参封装

    package main import ( "fmt" "sync" "time" ) type WaitGroupWrapper stru ...

  6. MVC5+EF6 简易版CMS(非接口) 第一章:新建项目

    目录 简易版CMS后台管理系统开发流程 MVC5+EF6 简易版CMS(非接口) 第一章:新建项目 MVC5+EF6 简易版CMS(非接口) 第二章:建数据模型 MVC5+EF6 简易版CMS(非接口 ...

  7. HtDP读后感

    我小时候很喜欢电脑. 不是听音乐,也不是玩游戏.纯粹是好奇:为什么一部冷冰冰的机器插上电源之后居然能如此强大.我每个月都期盼着订阅的电脑杂志快点到,到手以后总先上手试试里面的"奇淫巧技&qu ...

  8. iOS删除本地文件

    以前在博客里记录的东西都是截屏,没有插入代码,今天进去一看,图片都不显示了,只好重新插入代码,发现以前写的文件操作这块,没有写本地文件删除这个功能,重新再记录一下 //需要删除文件的物理地址 NSSt ...

  9. js 获取时间差

    写这片博客 ,下面代码虽然简单,但却很实用...默默留下来... var minute = 1000 * 60;var hour = minute * 60;var day = hour * 24;v ...

  10. struts2 学习记录 过滤器 国际化

    struts2接触不是一天两天了,但是一直没有用它做什么项目,但老师确一直说它有很大的学习价值,所以还是把我学习到的东西给记录一下,记录的东西没有规律,只是给自己留个备份, struts2中最关键的是 ...