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 相关文章推荐
半角全角相互转换的js函数
Oct 16 Javascript
IE中createElement需要注意的一个问题
Jul 13 Javascript
js中substring和substr的定义和用法
May 05 Javascript
jquery实现的代替传统checkbox样式插件
Jun 19 Javascript
JS实现双击屏幕滚动效果代码
Oct 28 Javascript
javascript实现的图片预览功能
Mar 25 Javascript
JS字符串按逗号和回车分隔的方法
Apr 25 Javascript
jQuery事件对象的属性和方法详解
Sep 09 jQuery
详解webpack提取第三方库的正确姿势
Dec 22 Javascript
webpack dll打包重复问题优化的解决
Oct 10 Javascript
angular2 NgModel模块的具体使用方法
Apr 10 Javascript
关于在LayUI中使用AJAX提交巨坑记录
Oct 25 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
解决phpmyadmin 乱码,支持gb2312和utf-8
2006/11/20 PHP
php的declare控制符和ticks教程(附示例)
2014/03/21 PHP
ThinkPHP整合百度Ueditor图文教程
2014/10/21 PHP
php实现搜索类封装示例
2016/03/31 PHP
PHP后端银联支付及退款实例代码
2017/06/23 PHP
php关联数组与索引数组及其显示方法
2018/03/12 PHP
thinkphp框架实现路由重定义简化url访问地址的方法分析
2020/04/04 PHP
JavaScript 对象成员的可见性说明
2009/10/16 Javascript
基于jquery的3d效果实现代码
2011/03/23 Javascript
json属性名为什么要双引号(个人猜测)
2014/07/31 Javascript
jQuery实现新消息闪烁标题提示的方法
2015/03/11 Javascript
js控制网页前进和后退的方法
2015/06/08 Javascript
Angular4 中常用的指令入门总结
2017/06/12 Javascript
vue绑定class与行间样式style详解
2017/08/16 Javascript
详解easyui基于 layui.laydate日期扩展组件
2018/07/18 Javascript
JS学习笔记之原型链和利用原型实现继承详解
2019/05/29 Javascript
JavaScript实现字符串与HTML格式相互转换
2020/03/17 Javascript
Python重新引入被覆盖的自带function
2014/07/16 Python
python中去空格函数的用法
2014/08/21 Python
Pandas Shift函数的基础入门学习笔记
2018/11/16 Python
Python实现的栈、队列、文件目录遍历操作示例
2019/05/06 Python
python中selenium操作下拉滚动条的几种方法汇总
2019/07/14 Python
python实现的爬取电影下载链接功能示例
2019/08/26 Python
详解python播放音频的三种方法
2019/09/23 Python
python pandas移动窗口函数rolling的用法
2020/02/29 Python
手把手教你安装Windows版本的Tensorflow
2020/03/26 Python
解决pyPdf和pyPdf2在合并pdf时出现异常的问题
2020/04/03 Python
Python检测端口IP字符串是否合法
2020/06/05 Python
深入剖析HTML5 内联框架iFrame
2016/05/04 HTML / CSS
美国最受欢迎的度假租赁网站:VRBO
2016/08/02 全球购物
Yummie官方网站:塑身衣和衣柜必需品
2019/10/29 全球购物
最新奶茶店创业计划书范文
2014/02/08 职场文书
复试通知单模板
2015/04/24 职场文书
世界各国短波电台对东亚播送时间频率表(SW)
2021/06/28 无线电
Nginx配置使用详解
2022/07/07 Servers
VUE递归树形实现多级列表
2022/07/15 Vue.js