设置定时器,在一段时间之后执行指定的代码,setTimeout与setInterval的区别在于setTimeout函数指定的代码仅执行一次

方法一:

window.setTimeout("alert('ok')",5000);

方法二:

window.setTimeout(function()
{
alert("Ok");
}, 5000);

方法三:

function showAlert()
{
alert("ok");
}
window.setTimeout(showAlert, 5000);

clearTimeout

清除setTimeout函数设置的定时器

function showAlert()
{
alert("ok");
}
var tt = window.setTimeout(showAlert, 5000);

window.clearTimeout(tt);

1.setTimeout,clearTimeout:设置暂停

使用window对象的setTimeout()方法设置暂停。该方法接受两个参数,要执行的代码和在执行它之前要等待的毫秒数(1/1000秒)。第一个参数可以是代码串(与eval()函数的参数相同),也可以是函数指针。例如,下面的代码都在1秒钟后显示一条警告:

setTimeout("alert('Hello World!')",1000);
setTimeout(function() { alert('Hello World!'); },1000);

当然,还可以引用以前定义的函数:
function sayHelloWorld()
{ alert("Hello World!"); }
setTimeout(sayHelloWorld,1000);

调用setTimeout()时,它创建一个数字暂停ID,与操作系统中的进程ID相似。暂停ID本质上是要延迟的进程ID,再调用 setTimeout()后,就不应该再执行它的代码。要取消还未执行的暂停,可调用clearTimeout()方法,并将暂停ID传递给它:
var iTimeoutId = setTimeout("alert('Hello World!')",1000);
alert(iTimeoutId);
clearTimeout(iTimeoutId);

其中,iTimeoutId 是一串数字,例如上述代码打出的iTimeoutId。
你也许会问:“为什么要定义暂停,又在执行它之前将其取消呢?”请 考虑在大多数应用程序中可见的工具提示。当把鼠标移动到一个按钮上时,停留一会,等待出 现黄色的文本框,提示该按钮的功能。如果只是短暂的把鼠标该按钮上,然后很快将其移动到另一个按钮上,那么第一个按钮的工具提示就不会显示,这就是要在执 行暂停代码前取消它的原因。因为你在执行代码前只想等待指定的时间量。如果用户的操作产生了不同的结果,则要取消该暂停。

2.setInterval,clearInterval设置时间间隔
时间间隔与暂停的运行方式相似,只是它无限此地每隔指定的时间段就重复执行一次指定的代码。可调用setInterval()方法设置时间间隔,它的参数与setTimeout()相同,是要执行的代码和每次执行之间等待的毫秒数。例如:
setInterval("alert('Hello world!')",1000);
setInterval(function() { alert("Hello world!"); },1000);
function sayHelloWorld()
{ alert("Hello World!"); }
setInterval(sayHelloWorld,1000);
此外,与setTimeout()类似,setInterval()方法也创建时间间隔ID,以标识要执行的代码。clearInterval()方法可 用这个ID阻止再次执行该代码。显然。这一点在使用时间间隔时更重要,因为如果不取消时间间隔,就会一直执行它,直到页面被卸载为止。下面是时间间隔用法的一个常见示例:
var iNum = 0;
var iMax = 100;
var iIntervalId = null;
function incNum()
{ iNum++;
if(iNum == iMax)
{ clearInterval(iIntervalId); } }
iIntervalId = setInterval(incNum, 500);
在这段代码中,每隔500毫秒就对数字iNum进行一次增量运算,直到它达到最大值(iMax), 此时该时间间隔将被清除。也可以用暂停实现该操作,这样即不必跟踪时间间隔的ID,代码如下:
var iNum = 0;
var iMax = 100;
function incNum()
{ iNum++;
if(iNum != iMax)
{ setTimeout(incNum,500); } }
setTimeout(incNum,500);
这段代码使用链接暂停,即setTimeout()执行的代码页调用了setTimeout()。如果在执行过增量运算后,iNum不等于 iMax,就调用setTimeout()方法。不必跟踪暂停ID,也不必清除它,因为代码执行后,将销毁暂停ID。

clearInterval() 方法可取消由 setInterval() 设置的 timeout。
clearInterval() 方法的参数必须是由 setInterval() 返回的 ID 值。
实例
下面这个例子将每隔 50 毫秒调用 clock() 函数。您也可以使用一个按钮来停止这个 clock:
<input type="text" id="clock" size="35" />
<script language=javascript>
var int=self.setInterval("clock()",50)
function clock()
{
var t=new Date()
document.getElementById("http://www.jinyuanbao.cn/").value=t
}
</script>
<button onclick="int=window.clearInterval(int)">Stop interval</button>

setTimeout,clearTimeout,setInterval,clearInteral详解的更多相关文章

  1. javascript函数setInterval和setTimeout的使用区别详解

    setTimeout和setInterval的使用 这两个方法都可以用来实现在一个固定时间段之后去执行JavaScript.不过两者各有各的应用场景. 方 法 实际上,setTimeout和setIn ...

  2. JavaScript之关闭轮询定时器(setTimeout/clearTimeout|setInterval/clearInterval)小结

    已知: 1.1 开启Timeout程序: scope.setTimeout("functionName()" | functionHandle, timeValue) 返回值:ti ...

  3. 关闭定时器(setTimeout/clearTimeout|setInterval/clearInterval)

    1.1 开启Timeout程序: scope.setTimeout("functionName()" | functionHandle, timeValue) 返回值:timerI ...

  4. setTimeout和setInterval定时器使用详解测试

    var len=4; while(len--){ var time=setTimeout(function(){ console.log(len); },0); console.log(time); ...

  5. JavaScript SetInterval与setTimeout使用方法详解

    setTimeout和setInterval的语法相同.它们都有两个参数,一个是将要执行的代码字符串,还有一个是以毫秒为单位的时间间隔,当过了那个时间段之后就将执行那段代码.不过这两个函数还是有区别的 ...

  6. setTimeOut和setInterval详解

    setTimeout和setInterval的语法相同.它们都有两个参数,一个是将要执行的代码字符串,还有一个是以毫秒为单位的时间间隔,当过了那个时间段之后就将执行那段代码.不过这两个函数还是有区别的 ...

  7. 有关定时器setTimeout()、setInterval()详解

    JavaScript提供定时执行代码的功能,叫做定时器(timer),主要由setTimeout()和setInterval()这两个函数来完成. setTimeout() setTimeout函数用 ...

  8. setInterval setTimeout 详解

    JavaScript的setTimeout与setInterval是两个很容易欺骗别人感情的方法,因为我们开始常常以为调用了就会按既定的方式执行, 我想不少人都深有同感, 例如 setTimeout( ...

  9. 【转】JS中setTimeout和setInterval的最大延时值详解

    前言 JavaScript提供定时执行代码的功能,叫做定时器(timer),主要由setTimeout()和setInterval()这两个函数来完成.而这篇文中主要给大家介绍的是关于JS中setTi ...

随机推荐

  1. knn原理及借助电影分类实现knn算法

    KNN最近邻算法原理 KNN英文全称K-nearst neighbor,中文名称为K近邻算法,它是由Cover和Hart在1968年提出来的 KNN算法原理: 1. 计算已知类别数据集中的点与当前点之 ...

  2. [Bzoj1051][HAOI2006]受欢迎的牛(tarjan)

    题目链接:https://www.lydsy.com/JudgeOnline/problem.php?id=1051 由题意可知,被所有牛仰慕的牛之间也互相仰慕,则最后的答案一定是唯一的强连通分量,如 ...

  3. python------生产者消费者模型 和 管道

    一.为什么要使用生产者和消费者? 在线程世界里,生产者就是生产数据的线程,消费者就是消费数据的线程,在多线程开发当中,如果生产者处理速度很快,而消费者处理速度很慢,那么生产者就必须等待消费者处理完,才 ...

  4. ls命令输出文件的绝对路径

    find $PWD | xargs ls -ld 再结合 grep 筛选

  5. 循环冗余校验(CRC)

    冗余码 CRC和海明校验类似,也是有效信息(k位)+校验信息(r位),需要满足N=k+r≤2r-1 生成多项式G(X) 定义:收发双方约定的一个(r+1)位二进制数,发送方利用G(X)对信息多项式做模 ...

  6. springboot的jar包部署

    由于springboot常用war包部署,改为cloud开发模式多端口情况下,部署反而不习惯 毕竟,war包要不要项目名访问都必须放在tomcat的root目录下 而此目录限制只能放置一个项目,并且登 ...

  7. 本机ip地址怎么查

     转自:https://www.192ly.com/basic/local-ip-address-lookup-method.html 百度搜索一下[IP],你就可以轻松看到你的IP地址了,百度出来的 ...

  8. shell PATH示例

  9. read - 在文件描述符上执行读操作

    概述#include <unistd.h> ssize_t read(int fd, void *buf, size_t count); 描述read() 从文件描述符 fd 中读取 co ...

  10. 微信小程序(3)--页面跳转和提示框

    微信小程序页面跳转方法: 1.<navigator url="../test/test"><button>点我可以切换可以返回</button> ...