JavaScript setTimeout()方法

JavaScript中的setTimeout()方法用于在指定的时间间隔后执行一个函数。此方法返回一个表示计时器ID值的数字。

与setInterval()方法不同，setTimeout()方法只执行一次函数。此方法可以使用或不使用window前缀来编写。

我们可以使用clearTimeout()方法停止超时或阻止setTimeout()方法中指定的函数的执行。setTimeout()方法返回的值可以作为clearTimeout()方法的参数来取消计时器。 +

setTimeout()方法的常用语法如下所示。

语法

window.setTimeout(function, milliseconds);

参数值

此方法接受两个参数值 function 和 milliseconds 它们的定义如下。

function： 它是包含将要执行的代码块的函数。

milliseconds： 此参数表示函数执行之后的时间间隔。间隔以毫秒为单位。默认值为0。它定义了代码的执行频率。如果未指定，则使用值 0 。

通过使用一些示例来了解 setTimeout() 方法的用法。

示例1

这是使用 setTimeout() 方法的简单示例。在此处，一个警告对话框将在两秒的时间间隔后显示。我们未使用任何方法来阻止 setTimeout() 方法中指定的函数的执行。因此 setTimeout() 方法仅在指定的时间间隔后执行指定的函数一次。

<html>
<head>
<title> setTimeout() method </title>
</head>
<body>
<h1> Hello World :) :) </h1>
<h3> This is an example of using the setTimeout() method </h3>
<p> Here, an alert dialog box will display after two seconds. </p>

<script>

var a;

a = setTimeout(fun, 2000);

function fun() {
alert(" Welcome to the javaTpoint.com ");
}
</script>

</body>

</html>

输出

JavaScript setTimeout()方法

经过两秒的间隔，输出结果将是-

JavaScript setTimeout()方法

示例2

这是使用 setTimeout() 方法的另一个示例。在两秒的时间间隔后，一个新的标签页打开，并在打开后两秒内关闭。我们使用 window.open() 方法打开一个新的标签页， window.close() 方法关闭已打开的标签页。

因为我们没有使用任何方法来阻止 setTimeout() 方法中指定的函数的执行。所以该函数在给定的时间间隔后只执行一次。

<html>
<head>
<title> setTimeout() method </title>
</head>
<body>
<h1> Hello World :) :) </h1>
<h3> This is an example of using the setTimeout() method </h3>
<p> Here, a new tab will open after 2 seconds and close after 2 seconds. </p>

<script>
var a = setTimeout(fun1, 2000);
function fun1()
{
var win1 = window.open();
win1.document.write(" <h2> Welcome to the javaTpoint.com </h2>");
setTimeout(function(){win1.close()}, 2000);
}
</script>

</body>

</html>

输出

JavaScript setTimeout()方法

两秒后，新标签页将会关闭。

示例3

在上面的示例中，我们没有使用任何方法来阻止setTimeout()函数的执行。在这里，我们使用clearTimeout()方法来停止函数的执行。

在两秒钟之前，我们必须点击给定的停止按钮才能看到效果。

<html>
<head>
<title> setTimeout() method </title>
</head>
<body>
<h1> Hello World :) :) </h1>
<h3> This is an example of using the setTimeout() method </h3>
<p> Click the following button before 2 seconds to see the effect. </p>
<button onclick = "stop()"> Stop </button>
<script>
var a = setTimeout(fun1, 2000);
function fun1()
{
var win1 = window.open();
win1.document.write(" <h2> Welcome to the javaTpoint.com </h2>");
setTimeout(function(){win1.close()}, 2000);
}
function stop() {
  clearTimeout(a);
}
</script>

</body>

</html>

输出

JavaScript setTimeout()方法