Window setTimeout() 메서드

setTimeout()메서드를 호출하여 타이머를 설정할 수 있습니다. 타이머가 만료되면 함수나 코드 블록이 호출됩니다。

이 메서드는 독립적으로 기간을 지정한 타이머의 고유한 식별자를 반환하므로 나중에clearTimeout()그것을 제거하세요。

사용clearTimeout()메서드를 사용하여 함수 실행을 방지하십시오。

이 함수는 한 번만 실행됩니다. 반복적으로 실행하려면setInterval()메서드。

문법：

window.setTimeout(function, delay, param1,　param2, ...)

예제

setTimeout(function(){ alert("Hello World"); },　2000);

테스트해보세요‹/›

브라우저 호환성

표中的 숫자는 setTimeout() 메서드를 완전히 지원하는 첫 번째 브라우저 버전을 지정합니다：

Method
setTimeout()	1	1	4	1	4

参数值

参数	描述
function	（必需）计时器到期后要执行的函数
delay	（必需）计时器应等待的时间（以毫秒为单位）（1000毫秒= 1秒），然后执行指定的函数或代码。如果省略，则使用值0
param1, param2, ...	（可选）传递给该函数(function)的其他参数　（IE9和更早版本中不支持）

技术细节

返回值：	一个数字，表示设置的计时器的超时ID值。将此值与clearTimeout()方法一起使用可取消计时器

更多实例

此示例引用外部“命名”函数：

예제

var timeoutID;
function myFunc() {
　　timeoutID = setTimeout(myCallback,　2000);
}
function myCallback() {
　　alert("Hello World");
}

테스트해보세요‹/›

使用clearTimeout()阻止函数运行：

예제

var timeoutID;
function myFunc() {
　　timeoutID = setTimeout(myCallback,　2000);
}
function myCallback() {
　　alert("Hello World");
}
function myStopFunc() {
　　　clearTimeout(timeoutID);
}

테스트해보세요‹/›

使用递归显示当前时间（就像数字手表一样，每1秒钟执行一次“ startTimer()”函数）：

예제

window.addEventListener("load", startTimer);
function startTimer() {
　　　var date = new Date();
　　　var x = document.getElementById("result");
　　　x.innerHTML = date.getHours()　+　":"　+　date.getMinutes()　+　":"　+　date.getSeconds();
　　　setTimeout(startTimer,　1000);　　　//　재귀　
}

테스트해보세요‹/›

使用setTimeout()创建动态进度条：

예제

var i = 0;
var bar = document.getElementById("progress",-bar);
var t;
function start() {
　　if(i <　100) {
　i++;
　bar.style.width = i　+　"%";
　bar.innerHTML = i　+　" % ";
　t = setTimeout(start,　60);　　//　재귀
　　}
}
function stop() {
　　clearTimeout(t);
}

테스트해보세요‹/›

아래의 "카운팅 시작" 버튼을 클릭하여 타이머를 시작하세요. "카운팅 중지" 버튼을 클릭하여 카운팅을 중지하세요:

테스트해보세요

myFunc 함수에 매개변수를 전달합니다(IE에서)9그리고 더 이전 버전에서는 동작하지 않습니다):

예제

var timeoutID = setTimeout(myFunc,　2000, "First", "Second", "Third");

테스트해보세요‹/›

하지만, 익명 함수를 사용하면 모든 브라우저에서 실행됩니다:

예제

var timeoutID = setTimeout(function(){ myFunc("First", "Second", "Third"); },　2000);

테스트해보세요‹/›

JavaScript 객체

JavaScript 참조 가이드

JS DOM 참조 가이드

Window setTimeout() 메서드

문법：

브라우저 호환성

参数值

技术细节

更多实例

관련 참조