<html>

 <head>

     <meta charset="utf-8"/>

     <title>jquery实现倒计时</title>

     <script src="js/jquery-1.8.3.min.js" type="text/javascript"></script>

 </head> 

 <body>

 <div id="remainTime" style="font-size:20px;font-weight:800;color:#FF9900"></div> 

 <script type="text/javascript">

     $(function(){

         var now=new Date();

         var end=new Date(2018,2,3,16,10,00);//结束的时间：年，月，日，分，秒（月的索引是0~11）

         /*两个时间相减,得到的是毫秒ms,变成秒*/

         var result=Math.floor(end-now)/1000; 

         var interval=setInterval(sub,1000); //定时器 调度对象

         /*封装减1秒的函数*/

         function sub(){

             if (result>1) {

                result = result - 1;

                var second = Math.floor(result % 60);     // 计算秒 ，取余

                var minite = Math.floor((result / 60) % 60); //计算分 ，换算有多少分，取余，余出多少秒

                var hour = Math.floor((result / 3600) % 24); //计算小时，换算有多少小时，取余，24小时制除以24，余出多少小时

                var day = Math.floor(result / (3600*24));  //计算天 ，换算有多少天

                $("#remainTime").html(day + "天" + hour + "小时" + minite + "分" + second + "秒");

             } else{

                 alert("倒计时结束！");

                 window.clearInterval(interval);//这里可以添加倒计时结束后需要执行的事件

             }

         };

     });

 </script>

 </body>

 </html>

jquery实现倒计时的更多相关文章

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

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

  2. jQuery自适应倒计时插件

    jQuery自适应倒计时插件 在线演示本地下载

  3. jQuery实现倒计时重新发送短信验证码功能示例

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

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

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

  5. jQuery控制倒计时

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

  6. jQuery简单倒计时插件

    一. 效果预览 二. 实现 1. 按照特定的类结构布局. 2. 需要先引入jQuery,再引入此文件. /** * Author: CC11001100 * * 简单倒计时 * * 1. 支持页面内同 ...

  7. jQuery TimeCircles 倒计时

    在线实例 默认 倒计时 使用方法 <h1 style="margin: 40px; font: 32px Microsoft Yahei; text-align: center;&qu ...

  8. jquery网页倒计时效果，秒杀，限时抢购！

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  9. jquery 60s倒计时

    前端开发中经常用到的发送按钮倒计时,每次都是重写,挺麻烦的,记录一下,以后直接来复制代码 <!DOCTYPE html> <html> <head> <met ...

随机推荐

  1. win10系统优化方法及chkdsk工具使用

    发现安装了测试版的Win10真的很慢!其实Win10在每次升级后,的确会比老版慢上很多,这只要是因为新增加的安全功能,往往会对系统速度造成拖累.但有很多方法都可以让你的系统运行如飞. http://b ...

  2. SpringBoot 为API添加统一的异常处理（一）

    首先我把异常分为两种,一种是可控制的,或者是由我们发现条件不正确主动抛出的异常,就像前城市编号不存在那个粟子:另一种是不可控制的,或者说是程序存在bug引起的异常,但这种异常也不想变态的就直接给前端抛 ...

  3. layer.confirm 防止post重复提交

    layer.confirm("确定对该资源单的价格"+isa+value+"元吗!", function(index, layero){ $(layero).f ...

  4. sumdoc t411 dir.txt

    C:\Users\zhoufeiyue\Documents\sumdoc t411\(9+条消息)redis Jedis存取list对象和map - shenjianxz的博客 - CSDN博客.mh ...

  5. shell基础知识8-xargs命令

    简介 xargs 命令应该紧跟在管道操作符之后.它使用标准输入作为主要的数据源,将从 stdin 中 读取的数据作为指定命令的参数并执行该命令. 将多行输入转换成单行输出 [root@dns-node ...

  6. LwIP应用开发笔记之四：LwIP无操作系统TFTP服务器

    前面我们已经实现了UDP的回环客户端和回环服务器的简单应用,接下来我们实现一个基于UDP的简单文件传输协议TFTP. 1.TFTP协议简介 TFTP是TCP/IP协议族中的一个用来在客户机与服务器之间 ...

  7. 【Docker学习之一】初始Docker

    一.云计算的概念 PaaS(Platform-as-a-Service:平台即服务),把应用服务的运行和开发环境作为一种服务.SaaS(Software-as-a-Service),意思为软件即服务, ...

  8. Linux磁盘空间不足

    Linux磁盘空间不足 描述:zabbix报警磁盘空间不足 1.登录服务器,查看磁盘空间 2.筛选空间占用的文件 层层筛选 3.将没用的文件删除 rm -f /opt/export/log/np_se ...

  9. Java对象在内存的结构

    一.内存布局 对象在内存中存储的结构由三部分组成:对象头.实例数据.对齐填充. 对象头 MarkWord(标记字段):哈希码.分代年龄.锁标志位.偏向线程ID.偏向时间戳等信息.Mark Word被设 ...

  10. time 库

    time 库的三类函数 时间获取: >>> import time >>> time.time() 1570150181.4052463#单位为秒 >> ...