JavaScript倒计时
倒计时:
1.设置一个有效的结束日期
2.计算剩余时间
3.将时间转换成可用的格式
4.输出时钟数据作为一个可重用的对象
5.在页面上显示时钟,并在它到达0时停止
<div id="clock">
<span id="days"></span>天
<span id="hours"></span>时
<span id="minutes"></span>分
<span id="seconds"></span>秒
</div>
<script>
/*计算剩余时间*/
function getTimeReamin(endtime){
//剩余的秒数
var remainSec=(Date.parse(endtime)-Date.parse(new Date()))/1000;
var days=Math.floor(remainSec/(3600*24));
var hours=Math.floor(remainSec/3600%24);
var minutes=Math.floor(remainSec/60%60);
var seconds=Math.floor(remainSec%60);
return{"remainSec":remainSec,
"days":days,
"hours":hours,
"minutes":minutes,
"seconds":seconds
}
}
var endtime="2016/10/10";
var clock=document.getElementById("clock");
//设置定时器
var timeid=setInterval(function () {
var t=getTimeReamin(endtime);
//判断时间格式
days= t.days>=0&& t.days<10?"0"+t.days:t.days;
hours= t.hours>=0&& t.hours<10?"0"+t.hours:t.hours;
minutes=t.minutes>=0&&t.minutes<10?"0"+t.minutes:t.minutes;
seconds=t.seconds>=0&&t.seconds<10?"0"+t.seconds:t.seconds;
//设置时间
document.getElementById("days").innerText= days;
document.getElementById("hours").innerText= hours;
document.getElementById("minutes").innerText= minutes;
document.getElementById("seconds").innerText=seconds;
//清除定时器
if(t.remainSec<=0){
clearInterval(timeid);
}
});
<script>
JavaScript倒计时的更多相关文章
- 比较全的JavaScript倒计时脚本
JavaScript倒计时在Web中用得非常广泛,比如常见的团购啊.还有什么值得期待的事情,都可以用到倒计时.现在举了四个例子,比如时间长的倒计时,小时倒计时,最简的倒计时,还有秒表等等,应该可以满足 ...
- JavaScript倒计时脚本
JavaScript倒计时在Web中用得非常广泛,比如常见的团购啊.还有什么值得期待的事情,都可以用到倒计时.现在举了四个例子,比如时间长的倒计时,小时倒计时,最简的倒计时,还有秒表等等,应该可以满足 ...
- 比较全的JavaScript倒计时脚本[xyytit]
需要做一个功能,给特定的活动或者商品添加一个倒计时提示,在网上找了好些方法,总结了比较好的一些方法,以备后用: 1. 比较长时间的倒计时(如:距离2014年还有0年, 0月, 30天, 9小时, 41 ...
- JavaScript - 倒计时
http://www.helloweba.com/demo/loading/ WEB开发中经常会用到倒计时来限制用户对表单的操作,比如希望用户在一定时间内看完相关协议信息才允许用户继续下一步操作,又比 ...
- Javascript倒计时页面跳转
在js中实现页面定时跳转我们要使用setInterval或setTimeOut函数,还可以使用页面的meta实现. 例1: <script type="text/javascript& ...
- javascript 倒计时代码
<script language="javascript" type="text/javascript"> var interval = 1000; ...
- javascript 倒计时跳转.
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- javascript倒计时代码及倒计时弹窗
在前端开发中,难免会用到倒计时.如做的双十一活动,在距活动开始的半个月前需要做些宣传工作,需要告知用户优惠活动什么时候开始.这个时候就要用到倒计时,如在整站的某个页面提醒用户活动什么时候开始等.而在活 ...
- [转载]在线考试javaScript倒计时
<script type="text/javascript"> /* ================== hi.baidu.com/coolinc === */ va ...
随机推荐
- 记一次从邻居无线路由渗透到邻居PC
起因:因为房东的网太垃圾 决定自己动手丰衣足食蹭邻居的网 结果发现一个信号超好的无线路由0x01踩点 无意中发现TP-LINK_28C0这个无线信号特别的好 看起来就肯定知道是隔壁邻居的 抓了一下包 ...
- 一文弄懂神经网络中的反向传播法——BackPropagation
最近在看深度学习的东西,一开始看的吴恩达的UFLDL教程,有中文版就直接看了,后来发现有些地方总是不是很明确,又去看英文版,然后又找了些资料看,才发现,中文版的译者在翻译的时候会对省略的公式推导过程进 ...
- hihocoder-1014 Trie树
hihocoder 1014 : Trie树 link: https://hihocoder.com/problemset/problem/1014 题意: 实现Trie树,实现对单词的快速统计. # ...
- [node.js 学习]1.start a simple server
1.启动一个本地的服务 下面是官方的例子,会生成一个随机端口,返回的是纯文本: var net = require('net'); var server = net.createServer((soc ...
- System.Environment.CurrentDirectory和Application.StartupPath
System.Environment.CurrentDirectory的含义是获取或设置当前工作路径,而Application.StartupPath是获取程序启动路径,表面上看二者没什么区别,但实际 ...
- 我们常用,却容易忽视——CSS的BFC(Block formatting contexts)
BFC——一个我们容易忽视掉的布局神器 今天给大家说说BFC这个概念,在说概念前,先给大家看个例子: 首先,定义三个div块元素 效果: 我们发现,块级元素的排列顺序是从上往下,一块接着一块,在w ...
- python 补漏计划
从今天开始把python的细枝末节都梳理下 争取 每星期 两篇博文
- win7下安装mysql后修改密码
mysql的安装教程网上很多,此处不过多介绍,个人觉得下面这篇教程是比较好的,一步到位.MySQL 5.7.9 ZIP 免安装版本配置过程_百度经验 http://jingyan.baidu.com ...
- [转]别再抱怨了,国内这么多优秀的Android资源你都知道吗?
因为一些大家都知道的原因,android很多官方出品的优秀开发资源在国内无法访问. 国内的同行们对此也做出了很多努力,有很多朋友通过各种手段把很多优秀的资源搬运到了国内,为国内android开发者提供 ...
- 关系数据库—SQL学习笔记
SQL的特点: 综合统一 高度非过程化(存取路径的选择以及SQL的操作过程由系统自动完成) 面向集合的操作方式,以同一种语法结构提供多种使用方法(可以在终端键盘上直接键入SQL命令对数据库进行操作,也 ...