setTimeout()方法设置一个计时器,一旦计时器到期,该计时器将调用函数或执行代码段。
该方法返回一个唯一标识计时器的超时ID,因此您可以稍后通过调用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); // Recursion
}测试看看‹/›使用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); // Recursion
}
}
function stop() {
clearTimeout(t);
}测试看看‹/›单击下面的“开始计数”按钮以启动计时器。单击“停止计数”按钮停止计数:
将参数传递给myFunc函数(在IE9和更早版本中不起作用):
var timeoutID = setTimeout(myFunc, 2000, "First", "Second", "Third");测试看看‹/›
但是,如果您使用匿名函数,它将在所有浏览器中运行:
var timeoutID = setTimeout(function(){ myFunc("First", "Second", "Third"); }, 2000);测试看看‹/›窗口(Window)参考:clearTimeout()方法
窗口(Window)参考:setInterval()方法
窗口(Window)参考:clearInterval()方法