jQuery实现最简单实用的分秒倒计时


Posted in Javascript onFebruary 05, 2017

本文实例为大家分享了jQuery分秒倒计时的具体代码,供大家参考,具体内容如下

实现原理:设置个定时器,自定义分钟和59秒。一秒钟秒数减1秒,60秒就减1分钟。

下面是全部代码

<!DOCTYPE HTML>
<html>
 
<head>
 <meta charset="UTF-8" />
 <title>pro.html</title>
 <style type="text/css">
 </style>
 <!--这里是自己本地的jquery-->
 <script type="text/javascript" src="js/jquery-1.7.min.js" ></script>
 <script>$(function(){
 var m=69;
 var s=59;
 setInterval(function(){
  if(s<10){
  //如果秒数少于10在前面加上0
   $('#time').html(m+':0'+s);
  }else{
   $('#time').html(m+':'+s);
  }
  s--;
  if(s<0){
  //如果秒数少于0就变成59秒
   s=59;
   m--;
  }
 },1000)
})</script>
</head>
 
<body>
 <p id="time">60:00</p>
</body>
 
</html>

更多关于倒计时的文章请查看专题:《倒计时功能》

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 播放器 控制
Jan 22 Javascript
浅谈javascript面向对象程序设计
Jan 21 Javascript
举例详解Python中smtplib模块处理电子邮件的使用
Jun 24 Javascript
黑帽seo劫持程序,js劫持搜索引擎代码
Sep 15 Javascript
JavaScript中split与join函数的进阶使用技巧
May 03 Javascript
关于JSON.parse(),JSON.stringify(),jQuery.parseJSON()的用法
Jun 30 Javascript
深入理解 JavaScript 中的 JSON
Apr 06 Javascript
js简易版购物车功能
Jun 17 Javascript
node.js学习之断言assert的使用示例
Sep 28 Javascript
详解为生产环境编译Angular2应用的方法
Dec 10 Javascript
微信小程序语音同步智能识别的实现案例代码解析
May 29 Javascript
基于JS+HTML实现弹窗提示是否确认提交功能
Jun 17 Javascript
用jquery的attr方法实现图片切换效果
Feb 05 #Javascript
JavaScript编写九九乘法表(两种任选)
Feb 04 #Javascript
JS动态生成年份和月份实例代码
Feb 04 #Javascript
详解AngularJS中$filter过滤器使用(自定义过滤器)
Feb 04 #Javascript
js常用DOM方法详解
Feb 04 #Javascript
JavaScript数组操作详解
Feb 04 #Javascript
jQuery使用方法
Feb 04 #Javascript
You might like
PHP+MYSQL的文章管理系统(二)
2006/10/09 PHP
PHP文件读写操作之文件写入代码
2011/01/13 PHP
php中JSON的使用方法
2015/04/30 PHP
求帮忙修改个php curl模拟post请求内容后并下载文件的解决思路
2015/09/20 PHP
十大使用PHP框架的理由
2015/09/26 PHP
node.js中的socket.io入门实例
2014/04/26 Javascript
SuperSlide2实现图片滚动特效
2014/06/20 Javascript
RequireJS入门一之实现第一个例子
2015/09/30 Javascript
jquery转盘抽奖功能实现
2015/11/13 Javascript
Query常用DIV操作获取和设置长度宽度的实现方法
2016/09/19 Javascript
基于Axios 常用的请求方法别名(详解)
2018/03/13 Javascript
js自定义input文件上传样式
2018/10/26 Javascript
使用electron制作满屏心特效的示例代码
2018/11/27 Javascript
vue.js的双向数据绑定Object.defineProperty方法的神奇之处
2019/01/18 Javascript
JavaScript 斐波那契数列 倒序输出 输出100以内的质数代码实例
2019/09/11 Javascript
js+springMVC 提交数组数据到后台的实例
2019/09/21 Javascript
vue 导航内容设置选中状态样式的例子
2019/11/01 Javascript
在vue中对数组值变化的监听与重新响应渲染操作
2020/07/17 Javascript
[01:02:53]DOTA2上海特级锦标赛主赛事日 - 5 总决赛Liquid VS Secret第二局
2016/03/06 DOTA
[57:24]LGD vs VGJ.T 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
Python的print用法示例
2014/02/11 Python
Python跳出循环语句continue与break的区别
2014/08/25 Python
Python中的MongoDB基本操作:连接、查询实例
2015/02/13 Python
Flask框架的学习指南之制作简单blog系统
2016/11/20 Python
Python微信公众号开发平台
2018/01/25 Python
Python 从列表中取值和取索引的方法
2018/12/25 Python
使用python的pandas为你的股票绘制趋势图
2019/06/26 Python
Python pandas库中的isnull()详解
2019/12/26 Python
使用openCV去除文字中乱入的线条实例
2020/06/02 Python
优衣库英国官网:UNIQLO英国
2016/12/25 全球购物
德国运动鞋网上商店:Afew Store
2018/01/05 全球购物
社区端午节活动方案
2014/01/28 职场文书
2015年五一劳动节演讲稿
2015/03/18 职场文书
2016个人廉洁自律承诺书
2016/03/25 职场文书
女人创业励志语录,句句蕴含能量,激发你的潜能
2019/08/20 职场文书
Spring Data JPA框架Repository自定义实现
2022/04/28 Java/Android