[JavaScript] Countdown timer

Source: Internet
Author: User
1. The basic goal is to design a minute-to-second countdown timer in JavaScript. Once the time is complete, the button becomes unavailable. For example, to illustrate the problem, it is adjusted to a table every 50 milliseconds, that is, every 0.05 hops, in actual use. onload = function (){...} setInterval (clock. move (), 50); change from 50 to 1000.

I. Basic Objectives

Design a minute-second countdown timer in JavaScript. Once the time is complete, the button becomes unclickable.

The specific effect is shown in. To illustrate the problem, it is adjusted to 50 milliseconds, that is, the table jumps every 0.05,


In actual use, set setInterval ("clock. move ()", 50) in window. onload = function () {...} to 1000.

Before the time is used up, you can click the button.

After the time is used up, the button cannot be clicked.


Ii. Production Process

 Time remaining
 Remaining Time:Script/* main function to be used, declare */var clock = new clock ();/* pointer to timer */var timer; window. onload = function () {/* The main function calls the move method in the clock function once every 50 seconds. */timer = setInterval ("clock. move () ", 50);} function clock () {/* s is a variable in clock (). A non-var global variable represents the remaining number of seconds */this. s = 140; this. move = function () {/* call the exchange function to convert data in seconds to minutes before output, because exchange is not in the main function window. therefore, you do not need to declare */document. getElementById ("timer "). innerHTML = exchange (this. s);/* each time a call is called, the remaining seconds are automatically subtracted */this. s = this. s-1;/* if time is exhausted, a window pops up to make the button unavailable and stop calling move () */if (this. s <0) {alert ("time to"); document. getElementById ("go "). disabled = true; clearTimeout (timer) ;}} function exchange (time) {/* The javascript division is a floating point division and Math must be used. floor returns its integer */this. m = Math. floor (time/60);/* existence of the remainder operation */this. s = (time % 60); this. text = this. m + "points" + this. s + "second";/* do not use this as the parameter time passed in, while other variables used in this function must use this */return this. text;} script


Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.