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()方法