setTimeout()方法設(shè)置一個計時器,一旦計時器到期,該計時器將調(diào)用函數(shù)或執(zhí)行代碼段。
該方法返回一個唯一標識計時器的超時ID,因此您可以稍后通過調(diào)用clearTimeout()將其刪除。
使用clearTimeout()方法阻止該函數(shù)運行。
該函數(shù)僅執(zhí)行一次。如果需要重復(fù)執(zhí)行,請使用setInterval()方法。
window.setTimeout(function, delay, param1, param2, ...)
setTimeout(function(){ alert("Hello World"); }, 2000);測試看看?/?表中的數(shù)字指定了完全支持setTimeout()方法的第一個瀏覽器版本:
| Method | ![]() | ![]() | ![]() | ![]() | ![]() |
| setTimeout() | 1 | 1 | 4 | 1 | 4 |
| 參數(shù) | 描述 |
|---|---|
| function | (必需)計時器到期后要執(zhí)行的函數(shù) |
| delay | (必需)計時器應(yīng)等待的時間(以毫秒為單位)(1000毫秒= 1秒),然后執(zhí)行指定的函數(shù)或代碼。如果省略,則使用值0 |
| param1, param2, ... | (可選)傳遞給該函數(shù)(function)的其他參數(shù) (IE9和更早版本中不支持) |
| 返回值: | 一個數(shù)字,表示設(shè)置的計時器的超時ID值。將此值與clearTimeout()方法一起使用可取消計時器 |
|---|
此示例引用外部“命名”函數(shù):
var timeoutID;
function myFunc() {
timeoutID = setTimeout(myCallback, 2000);
}
function myCallback() {
alert("Hello World");
}測試看看?/?使用clearTimeout()阻止函數(shù)運行:
var timeoutID;
function myFunc() {
timeoutID = setTimeout(myCallback, 2000);
}
function myCallback() {
alert("Hello World");
}
function myStopFunc() {
clearTimeout(timeoutID);
}測試看看?/?使用遞歸顯示當前時間(就像數(shù)字手表一樣,每1秒鐘執(zhí)行一次“ startTimer()”函數(shù)):
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); // Recursion
}測試看看?/?使用setTimeout()創(chuàng)建動態(tài)進度條:
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); // Recursion
}
}
function stop() {
clearTimeout(t);
}測試看看?/?單擊下面的“開始計數(shù)”按鈕以啟動計時器。單擊“停止計數(shù)”按鈕停止計數(shù):
將參數(shù)傳遞給myFunc函數(shù)(在IE9和更早版本中不起作用):
var timeoutID = setTimeout(myFunc, 2000, "First", "Second", "Third");測試看看?/?
但是,如果您使用匿名函數(shù),它將在所有瀏覽器中運行:
var timeoutID = setTimeout(function(){ myFunc("First", "Second", "Third"); }, 2000);測試看看?/?窗口(Window)參考:clearTimeout()方法
窗口(Window)參考:setInterval()方法
窗口(Window)參考:clearInterval()方法