<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<span id="hour">01</span>
<span>:</span>
<span id="minute">01</span>
<span>:</span>
<span id="second">59</span>
</body>
<script type="text/javascript" src = "../jquery-1.11.0.min.js"></script>
<script type="text/javascript">
var getHour = $('#hour').text();
var getMin = $('#minute').text();
var getSec = $('#second').text();
setInterval(function() {
var allTime = parseInt(getSec) + parseInt(getMin * 60) + parseInt(getHour * 3600);
allTime--;
if (getSec > 0) {
getSec--;
if (getSec < 10) {
getSec = '0' + getSec;
// console.log(getSec)
}
$('#second').html(getSec)
} else {
getSec = 59;
}
if (allTime % 60 == 0) {
getMin--;
// console.log(getMin)
if (getMin >= 0) {
if (getMin < 10) {
getMin = '0' + getMin;
}
$('#minute').html(getMin)
} else {
getMin = 30;
$('#minute').html(getMin)
}
}
if (allTime % 3600 == 0) {
getHour--;
if (getHour >= 0) {
if (getHour < 10) {
getHour = '0' + getHour;
}
$('#hour').html(getHour)
} else {
getHour = 30;
$('#hour').html(getHour)
}
}
}, 1)
</script>
</html>

js 实现倒计时效果的更多相关文章

  1. JS实现倒计时效果，并退出系统

    背景:由于单点登录后,一直在本系统操作,可是门户体统的会话失效时间有30分钟,所以30分钟后,需要重新登录系统才可以进行操作. 方法:想过在本系统中的每个操作都先跟门户系统进行交互,渠道refresh ...

  2. js实现倒计时效果

    <!DOCTYPE html><head><meta http-equiv="Content-Type" content="text/htm ...

  3. 二、JavaScript语言--JS实践--倒计时效果

    主要内容:分析不同倒计时效果的计算思路及方法,掌握日期对象Date,获取时间的方法,计算时差的方法,实现不同的倒时计效果. Javascript 日期对象: Date()返回当前的日期和时间 getY ...

  4. (转)js实现倒计时效果(年月日时分秒)

    原文链接:http://mengqing.org/archives/js-countdown.html 之前做的活动页面很多都用到了倒计时功能,所以整理下下次直接用.(用的是张鑫旭写的一个倒计时,稍作 ...

  5. js日期倒计时效果

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. js制作倒计时效果

    该程序可以计算任意指定的两个日期中间的差值. 本例子的指定日期是2017年1月1日,当前时间是2016年10月21日:计算它们之间的差值,在网页上显示如图所示: 关键部分代码: var nowtime ...

  7. js 验证码倒计时效果

    function settime(obj) { if(second == 0){ obj.removeAttribute("disabled"); obj.value=" ...

  8. 用js实现倒计时效果

    首先获得两个时间的时间戳 var newdate = new Date('2021-01-22 21:25:00').getTime(); var olddate = new Date().getTi ...

  9. js实现倒计时及时间对象

    JS实现倒计时效果代码如下: <!doctype html> <html> <head> <meta charset="utf-8"> ...

随机推荐

  1. nodejs + nginx + ECS阿里云服务器环境设置

    nodejs + nginx + ECS阿里云服务器环境设置 部署 nodejs ECS 基于 CentOS7.2 详细步骤:click 部署 nginx 安装 添加Nginx软件库: [root@l ...

  2. mysql数据库开启日志

    旧版 #开启慢查询 slow_query_log # (超过2秒的SQL语法记录起来,设短一点来记录除错也是一种方法.) long_query_time = 2 log-slow-queries=D: ...

  3. Java中遍历Map的常用方法

    以下方法适用于任何map实现(HashMap, TreeMap, LinkedHashMap, Hashtable, 等等): 方式一(推荐): // 推荐 // 在for-each循环中使用entr ...

  4. OK 开始实践书上的项目一：即使标记

    OK 开始实践书上的项目一:及时标记 然而....又得往前面看啦! ----------------------我是分割线------------------------ 代码改变世界

  5. 使用 rsync 同步

    原文地址 http://www.howtocn.org/rsync:use_rsync 选项 说明 -a, ––archive 归档模式,表示以递归方式传输文件,并保持所有文件属性,等价于 -rlpt ...

  6. openfire+smack 实现即时通讯基本框架

    smack jar下载地址 http://www.igniterealtime.org/downloads/download-landing.jsp?file=smack/smack_3_2_2.zi ...

  7. Xmind 体验分享

    Xmind 8 体验 初识思维脑图 这两天在学习使用思维脑图(xmind是其中一款软件)ing,在体验了一把思维脑图的使用后,深深感受到了脑洞大开的魔力. 从昨晚开始研究使用,到今天晚上截止,自己试着 ...

  8. 学习笔记：JavaScript-入门篇

    1.对话框,输出框,警告框   1. document.write() 可用于直接向 HTML 输出流写内容.简单的说就是直接在网页中输出内容.   2.alert(字符串或变量);   3.conf ...

  9. [刷题]算法竞赛入门经典(第2版) 4-10/UVa815 - Flooded!

    书上具体所有题目:http://pan.baidu.com/s/1hssH0KO 代码:(Accepted,0 ms) //UVa815 - Flooded! #include<iostream ...

  10. python爬虫第一天

    python爬虫第一天 太久没折腾爬虫 又要重头开始了....感谢虫师大牛的文章. 接下来的是我的随笔 0x01 获取整个页面 我要爬的是百度贴吧的图,当然也是跟着虫师大牛的思路. 代码如下: #co ...