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 ...
随机推荐
- webform开发基础
ASP.NET WebForm C/S(Client/Server):客户端服务器 B/S(Browser/Server):浏览器服务器 C/S和B/S的区别: 首先必须强调的是C/S和B/S并没有本 ...
- [LeetCode] Missing Number 丢失的数字
Given an array containing n distinct numbers taken from 0, 1, 2, ..., n, find the one that is missin ...
- [LeetCode] Delete Duplicate Emails 删除重复邮箱
Write a SQL query to delete all duplicate email entries in a table named Person, keeping only unique ...
- 一个简单的ASP.NET MVC异常处理模块
一.前言 异常处理是每个系统必不可少的一个重要部分,它可以让我们的程序在发生错误时友好地提示.记录错误信息,更重要的是不破坏正常的数据和影响系统运行.异常处理应该是一个横切点,所谓横切点就是各个部分都 ...
- C-RAN 集中化、协作化、云化、绿色节能(4C)
中国移动C-RAN力拼第4个C:2018年6月外场组网验证 http://www.c114.net ( 2016/11/22 07:41 ) C114讯 11月22日早间消息(子月)2009年,中国移 ...
- 框架dubbox的简单使用
之前: RPC: Remote Produedure Call :一种通过网络从远程计算机程序上请求服务,而不需要了解底层网络技术的协议 SOA: Service-oriented architect ...
- DataSet与DataTable与DataRow的关系
1. 添加数据: DataRow dr=MyDataSet.Tables["User"].NewRow(); dr["UserName"] = "张三 ...
- 读取TDrawGrid之获取博易数据
朋友叫我帮忙写个从博易读取数据的工具,可无奈数据所在控件并不是Windows标准控件,也就是说没办法通过发送系统消息来获取 相关数据,于是乎试了一下从内存直接读取,可最后并不能达到预期目的,原因是笔者 ...
- asp.net mvc 权限过滤和单点登录(禁止重复登录)
1.权限控制使用controller和 action来实现,权限方式有很多种,最近开发项目使用控制控制器方式实现代码如下 /// <summary> /// 用户权限控制 /// < ...
- Android 样式 (style) 和主题(theme)
转载:https://gold.xitu.io/post/58441c48c59e0d0056a30bc2 样式和主题 样式是指为 View 或窗口指定外观和格式的属性集合.样式可以指定高度.填充.字 ...