How to Implement the JavaScript minute-second countdown timer _ javascript tips-js tutorial

This article mainly introduces the implementation of the JavaScript minute-second countdown method, which can implement the countdown effect by millisecond, and has some reference value, for more information about how to implement the JavaScript minute-second countdown timer, see the example in this article. Share it with you for your reference. The specific analysis is as follows:

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

The Code is as follows:

Time remaining



Remaining Time:



Script
/* Declare the function to be used by the main function */
Var clock = new clock ();
/* Pointer to the 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 the variable in clock (), which is a non-var global variable and represents the remaining number of seconds */
This. s = 140;
This. move = function (){
/* Call the exchange function for second-to-second conversion before output, because exchange is not used in the main function window. onload, so no declaration is required */
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 the time is exhausted, a window pops up to make the button unavailable and stop calling move () in the clock function ()*/
If (this. s <0 ){
Alert ("time ");
Document. getElementById ("go"). disabled = true;
ClearTimeout (timer );
}
}
}
Function exchange (time ){
/* The javascript division is a floating-point division. You must use Math. floor to obtain its integer part */
This. m = Math. floor (time/60 );
/* Existence of the remainder operation */
This. s = (time % 60 );
This. text = this. m + "Minute" + this. s + "second ";
/* Do not use this as the passed form parameter time, while the other variables used in this function must use this */
Return this. text;
}
Script

I hope this article will help you design javascript programs.