Window clearInterval()Method

Window 对象参考手册Window Object

Example

Display the current time (the setInterval() function executes the function once every second, like a watch). Use clearInterval() to stop execution:

var myVar = setInterval(function(){ myTimer() }, 1000); function myTimer() { var d = new Date(); var t = d.toLocaleTimeString(); document.getElementById("demo").innerHTML = t; } function myStopFunction() { clearInterval(myVar); }

Try it Yourself »

Definition and Usage

The clearInterval() method cancels the timed execution operation set by the setInterval() function.

The parameter of the clearInterval() method must be the ID value returned by setInterval().

Note:To use the clearInterval() method, use a global variable when creating the timed execution operation:

myVar = setInterval("javascript 函数", milliseconds);

You can use the clearInterval() method to stop execution.


Browser Support

The numbers in the table indicate the first browser version number that supports the property.

Method
clearInterval() 1.0 4.0 1.0 1.0 4.0

Syntax

clearInterval(id_of_setinterval)
Parameter Description
id_of_setinterval The return value obtained when calling the setInterval() function. Using this returned identifier as a parameter, you can cancel the timed execution operation set by that setInterval().

Technical Details

Return Value: No return value.

More Examples

Example

Switch the background color every 300 milliseconds, until stopped with clearInterval():

var myVar = setInterval(function(){ setColor() }, 300); function setColor() { var x = document.body; x.style.backgroundColor = x.style.backgroundColor == "yellow" ? "pink" : "yellow"; } function stopColor() { clearInterval(myVar); }

Try it Yourself »

Example

Use setInterval() and clearInterval() to create a dynamic progress bar:

function move() { var elem = document.getElementById("myBar"); var width = 0; var id = setInterval(frame, 100); function frame() { if (width == 100) { clearInterval(id); } else { width++; elem.style.width = width + '%'; } } }

Try it Yourself »


Related Pages

Window Object:setInterval() Method

Window Object:setTimeout() Method

Window Object:clearTimeout() Method

Window 对象参考手册Window Object

Other Extensions