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 相关文章推荐
Opacity.js
Jan 22 Javascript
web 页面分页打印的实现
Jun 22 Javascript
使用滤镜设置透明导致 IE 6/7/8/9 解析异常的解决方法
Apr 07 Javascript
根据表格中的某一列进行排序的javascript代码
Nov 29 Javascript
js身份证判断方法支持15位和18位
Mar 18 Javascript
JS实现两个大数(整数)相乘
Apr 28 Javascript
JS烟花背景效果实现方法
Mar 03 Javascript
解析JavaScript数组方法reduce
Dec 12 Javascript
JavaScript制作简易计算器(不用eval)
Feb 05 Javascript
javascript中floor使用方法总结
Feb 02 Javascript
微信小程序实现多选框全选与反全选及购物车中删除选中的商品功能
Dec 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 memcache扩展的三种安装方法
2009/04/26 PHP
PHP 缓存实现代码及详细注释
2010/05/16 PHP
php中定义网站根目录的常用方法
2010/08/08 PHP
php常用字符串处理函数实例分析
2014/11/22 PHP
基于ThinkPHP+uploadify+upload+PHPExcel 无刷新导入数据
2015/09/23 PHP
纯php生成随机密码
2015/10/30 PHP
PHP实现的Redis多库选择功能单例类
2017/07/27 PHP
thinkphp5使用无限极分类
2019/02/18 PHP
Extjs TriggerField在弹出窗口显示不出问题的解决方法
2010/01/08 Javascript
浏览器兼容console对象的简要解决方案分享
2013/10/24 Javascript
AngularJS 2.0新特性有哪些
2016/02/18 Javascript
第七章之菜单按钮图标组件
2016/04/25 Javascript
BOM系列第一篇之定时器setTimeout和setInterval
2016/08/17 Javascript
jQuery easyui刷新当前tabs的方法
2016/09/23 Javascript
angular实现表单验证及提交功能
2017/02/01 Javascript
Bootstrap输入框组件简单实现代码
2017/03/06 Javascript
Angular表格神器ui-grid应用详解
2017/09/29 Javascript
fastadmin中调用js的方法
2019/05/14 Javascript
swiper4实现移动端导航切换
2020/10/16 Javascript
Vue快速实现通用表单验证的方法
2020/02/24 Javascript
vue 点击其他区域关闭自定义div操作
2020/07/17 Javascript
在Python的Django框架的视图中使用Session的方法
2015/07/23 Python
利用Python命令行传递实例化对象的方法
2016/11/02 Python
深入理解Python3 内置函数大全
2017/11/23 Python
python实现弹窗祝福效果
2019/04/07 Python
Python子进程subpocess原理及用法解析
2020/07/16 Python
Expedia法国:全球最大在线旅游公司
2018/09/30 全球购物
三陽商会官方网站:Sanyo iStore
2019/05/15 全球购物
俄罗斯外国汽车和国产汽车配件网上商店:Движком
2020/04/19 全球购物
优秀老员工获奖感言
2014/02/15 职场文书
合法的离婚协议书范本
2014/10/23 职场文书
mysql升级到5.7时,wordpress导数据报错1067的问题
2021/05/27 MySQL
pycharm代码删除恢复的方法
2021/06/26 Python
SQL注入篇学习之盲注/宽字节注入
2022/03/03 MySQL
Python必备技巧之字符数据操作详解
2022/03/23 Python
vue实现列表拖拽排序的示例代码
2022/04/08 Vue.js