javascript毫秒计时器_JavaScript分秒倒计时器实现方法

本文实例讲述了JavaScript分秒倒计时器实现方法。分享给大家供大家参考。具体分析如下：

一、基本目标

在JavaScript设计一个分秒倒计时器，一旦时间完成使按钮变成不可点击状态

具体效果如下图，为了说明问题，调成每50毫秒也就是每0.05跳一次表，

真正使用的时候，把window.οnlοad=function(){...}中的setInterval("clock.move()",50);从50调成1000即可。

在时间用完之前，按钮还是可以点击的。

时间用完之后，按钮就不能点击了。

二、制作过程

time remaining

剩余时间：

/*主函数要使用的函数，进行声明*/

var clock=new clock();

/*指向计时器的指针*/

var timer;

window.οnlοad=function(){

/*主函数就在每50秒调用1次clock函数中的move方法即可*/

timer=setInterval("clock.move()",50);

}

function clock(){

/*s是clock()中的变量，非var那种全局变量，代表剩余秒数*/

this.s=140;

this.move=function(){

/*输出前先调用exchange函数进行秒到分秒的转换，因为exchange并非在主函数window.onload使用，因此不需要进行声明*/

document.getElementById("timer").innerHTML=exchange(this.s);

/*每被调用一次，剩余秒数就自减*/

this.s=this.s-1;

/*如果时间耗尽，那么，弹窗，使按钮不可用，停止不停调用clock函数中的move()*/

if(this.s<0){

alert("时间到");

document.getElementById("go").disabled=true;

clearTimeout(timer);

}

function exchange(time){

/*javascript的除法是浮点除法，必须使用Math.floor取其整数部分*/

this.m=Math.floor(time/60);

/*存在取余运算*/

this.s=(time%60);

this.text=this.m+"分"+this.s+"秒";

/*传过来的形式参数time不要使用this，而其余在本函数使用的变量则必须使用this*/

return this.text;

}

希望本文所述对大家的javascript程序设计有所帮助。

javascript毫秒计时器_JavaScript分秒倒计时器实现方法相关推荐

js倒计时天时分秒php,JS制作分秒倒计时器
这篇文章主要介绍了JavaScript分秒倒计时器实现方法,可实现按照毫秒倒计时的效果,具有一定参考借鉴价值,需要的朋友可以参考下本文实例讲述了JavaScript分秒倒计时器实现方法.分享给大家供 ...
android 倒计时动画下载,倒计时器app下载-倒计时器安卓最新版-幻想游戏网
倒计时器app还有二次元的壁纸,相信你已经迫不及待了,等你来发掘,提供倒计时功能,需要的用户欢迎来本站点击下载. 倒计时器功能动画效果: 界面采用动画主题效果,增加生动的气息可自定义小组件背景,自 ...
Javascript 实现一个分钟秒钟倒计时器
<span id="minute">5</span>分 <span id="second">0</span>秒& ...
JAVA 制作给定时间倒计时器
Java 制作给定时间的倒计时器首先创建倒计时器类 public class NSTimer {private int hh; //小时private int mm; //分钟private int ...
javascript计时器_JavaScript计时器：您需要了解的一切
javascript计时器 by Samer Buna 通过Samer Buna JavaScript计时器:您需要了解的一切 (JavaScript Timers: Everything you n ...
php多人访问抽奖倒计时一致,Javascript和PHP倒计时器为每个人显示相同的计时器...
我有生成倒计时器所需的脚本,该计时器有一个启动和恢复按钮.我试图做的是在一个控制另一页上的计时器的页面上有启动,停止和重置按钮. 因此,如果用户X访问page.html,他们将看到一个0的计时器. A ...
JavaScript制作页面倒计时器
制作页面倒计时器,选定一个未来时间,得到几天几时几分几秒的倒计时. 在这里选择使用两个时间相差的毫秒数来计算相对应的天数.小时数.分钟数和秒数.为了使代码看起来简洁,进行了封装函数. 1.setInt ...
android 倒计时跳过,倒计时器跳过一些毫秒
正如您可以看到最后一次呼叫onTick正在发生2秒钟,然后接下来的呼叫将近2秒钟后.倒计时器跳过一些毫秒 @Override public void onCreate(Bundle savedInst ...
javascript毫秒计时器_基于javascript实现精确到毫秒的倒计时限时抢购
这篇文章为大家分享了javascript实现倒计时限时抢购,精确到毫秒的倒计时,供大家参考,具体内容如下一.效果图下面的图片就是聚划算上面的限时抢的效果二.实现限时抢的效果需要用到的知识 :Ja ...

javascript毫秒计时器_JavaScript分秒倒计时器实现方法

javascript毫秒计时器_JavaScript分秒倒计时器实现方法相关推荐

最新文章

热门文章