JavaScipt实现倒计时方法总结
JavaScript中提供了两种实现计时、延时的方法，分别如下：
一、 t = setTimeout(“function()", millisecond) 与 clearTimeout(t) 方法配套使用。
t = setTimeout(“function()", millisecond) 方法中，function（）函数里定义想要定时调用的代码，millisecond参数代表想要延迟的计时时间，t 是函数返回的ID值。此函数仅根据时间周期调用function（）函数一次。但是可以通过递归调用，实现多次循环计时。
clearTimeout（t）函数可以清除setTimeout（）函数的计时信息，停止计时。
60秒倒计时代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title></title>
</head> <body onload="CountTime()">
<div id = "timeBar" style="font-size:22px;" align="center"></div> <script type = "text/javascript" src = "CountTime.js"></script>
</body>
</html>
time = 60; function CountTime()
{
document.getElementById("timeBar").innerHTML = time;
time = time - 1;
if ( time == -1)
{
clearTimeout(t);
}
else
{
t = setTimeout("CountTime()",1000);
} }
二、t= setInterval（”function（）“，millisecond）方法与setTimeout（）使用方法类似，但是该函数是以设置的时间为周期，周期性的调用function（）函数执行代码。
clearInterval（t）方法是用来清除计时信息，终止计时程序。
可实现60秒倒计时代码如下（Html代码共用第一部分）：
time = 60;
function SetText()
{
document.getElementById("timeBar").innerHTML = time;
time = time - 1;
if ( time == -1)
{
clearInterval(t);
}
}
function CountTime()
{
t = setInterval("SetText()",1000);
}
以上两种方法均可实现倒计时的功能。
JavaScipt实现倒计时方法总结的更多相关文章
- jquery 60秒倒计时(方法二)
<script type="text/javascript">var wait=60;document.getElementById("btn"). ...
- [转]Android实现计时与倒计时(限时抢购)的几种方法
在购物网站的促销活动中一般都有倒计时限制购物时间或者折扣的时间,这些都是如何实现的呢? 在一个安卓客户端项目中恰好遇到了类似的问题,一开始使用的是Timer与 TimerTask, 虽然此方法通用,但 ...
- Android实现计时与倒计时(限时抢购)的几种方法
在购物网站的促销活动中一般都有倒计时限制购物时间或者折扣的时间,这些都是如何实现的呢? 在一个安卓客户端项目中恰好遇到了类似的问题,一开始使用的是Timer与 TimerTask, 虽然此方法通用,但 ...
- 原生JavaScript时间倒计时的方法
这个思路是来源用%的方法来做的: 以前用%做过转秒的 现在用来做倒计时方法: 需要用到的方法是getTime:获取距离1970年1月1日午夜00:00之间的毫秒差: var targetTime=ne ...
- ios 简单的倒计时验证码数秒过程实现
timer = [NSTimer scheduledTimerWithTimeInterval:1.0 target:self selector:@selector(timerFireMethod:) ...
- BZOJ4230: 倒计时
4230: 倒计时 Time Limit: 10 Sec Memory Limit: 256 MBSubmit: 20 Solved: 12[Submit][Status][Discuss] De ...
- Android 计时与倒计时
方法一 Timer与TimerTask(Java实现) [java] view plain copy print ? public class timerTask extends Activit ...
- js原生倒计时
倒计时是2019年6月7号10点开始的 代码粘贴过去直接运行即可 <!DOCTYPE html> <html lang="en"> <head> ...
- 微信小程序——倒计时功能
做小程序项目中,需要做一个倒计时功能,如下图: 记录一下实现步骤: 1.考虑到这个功能可能会有多处用到,所以把倒计时的函数写在utils.js里面: const formatNumber = n =& ...
随机推荐
- jquery学习（3）--高级选择器
自己手写的学习笔记.常规选择器: /****************学习--高级选择器(1)****************/---高级选择器:ie7+ 层次选择器: 后代选择器 ul li ...
- 转: HTML5新特性之Mutation Observer
转: HTML5新特性之Mutation Observer Mutation Observer是什么 Mutation Observer(变动观察器)是监视DOM变动的接口.当DOM对象树发生任何变动 ...
- 使WEBBROWSER 可编辑
procedure TForm1.CheckBox1Click(Sender: TObject);begin {这里是让整个页面可编辑, 也可以单独编辑某个元素} WebBrowser1.OleO ...
- Java Scoket之java.io.EOFException解决方案
Java Scoket之java.io.EOFException解决方案 Socket接收数据的时候,常常会抛出java.io.EOFException异常,也没有明确的原因和提示,在网上搜搜,很 ...
- VC使用双缓冲避免绘图闪烁的正确使用方法【转】
使用内存DC绘图,然后实现双缓冲,避免绘图闪烁,这个小技术简单但很有效.但是仍然有很多人说使用了双缓冲,图片却仍然有闪烁,分析了几个这样的例子,发现 其实不是双缓冲的技术问题,而是使用者没有正确理解和 ...
- [LeetCode][Python]Palindrome Number
# -*- coding: utf8 -*-'''__author__ = 'dabay.wang@gmail.com'https://oj.leetcode.com/problems/palindr ...
- umount.nfs device busy day virsh extend diskSpace, attachDisk
KVM中linux虚拟机的硬盘添加方法 最近虚拟机中运行的东西比较多,很多.而刚启动的时候虚拟机分配的磁盘比较少,随着日志还有平时的上传文件的积累,磁盘空间报警了.网上查了下资料,自己也做了下实验.总 ...
- rem单位
rem单位 rem基础 px是固定单位,不同分辨率下效果不一样,导致网页布局出现偏差. em是根据父元素来改变字大小 rem是根据根元素html来改变字体大小,只要改变了根元素的font-size就可 ...
- HTML系列（八）：表格
一.基本表格: 表格标记<table>,行标记<tr>,单元格标记<td> 基本语法: <table> <tr> <td>单元格 ...
- 2014.8.16 if语句
语句 if语句 大体可以分一下几种: 小知识 生成一个随机数: Random sss = new Random(); int a = sss.Next(100); Console.WriteLine ...