js中setInterval和setTimeout区别和用法

原文地址：http://www.2cto.com/kf/201207/142102.html
setTimeout

setTimeout() //- 在指定时间后执行代码
clearTimeout() //- 取消 setTimeout()


注意: setTimeout() 和 clearTimeout() 都是HTML DOM 的 Window 对象的函数。


　 用法: 　　setTimeout()方法用于在指定的毫秒数后调用函数或计算表达式。　　
   语法: 　　setTimeout(code,millisec) 　　
   code （必需）：要调用的函数后要执行的 JavaScript 代码串。 　　
   millisec（必需）：在执行代码前需等待的毫秒数。　　
   提示： 　　setTimeout() 只执行 code 一次。如果要多次调用，请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。

两种调用函数的写法：

function page_list(){
   alert("shihuan");
}
window.setTimeout(page_list, 5000);   //表示延时5秒执行page_list()函数
window.setTimeout("page_list()", 30000);   //表示延时30秒执行page_list()函数

使用clearTimeout可以随时停止计时。


应用技巧
建议将setTimeout单独设置为一个函数。如：

function delayRun(code, time) {
   var t = setTimeout(code, time);
}

这样，在需要让某段代码延时执行的时候，只需在这段代码前加入这个函数就可以了。如：
onmouseover = delayRun("setTab(0,0)", 500)
其中setTab是一个自定义的函数。如果以后不想让setTab延时执行，则去掉语句中的delayRun相关的代码即可，
改为：onmouseover=setTab(0, 0) 就可以了。
这种写法避免每一个需要延时的地方都写一段setTimeout的代码，只需要直接调用就可以了，很方便。也节省了代码的量。

--------------------------------------------------------------------------------------------------

setInterval


setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。


setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。
由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。


语法

setInterval(code,millisec)
code    必需。要调用的函数或要执行的代码串。
millisec 必需。周期性执行或调用 code 之间的时间间隔，以毫秒计。

一个可以传递给 Window.clearInterval() 从而取消对 code 的周期性执行的值。


例子：

var leftSeconds = 10;
var intervalId;

document.getElementById('btnReg').disabled = true;
intervalId = setInterval("countDown()",1000);

function countDown(){   
  if(leftSeconds <=0){
   document.getElementById("btnReg").value="submit";
    document.getElementById("btnReg").disabled = false;
    clearInterval(intervalId);
    return;
  }else{
    leftSeconds--;
    document.getElementById("btnReg").value="请仔细阅读" + leftSeconds + "秒";
  }
}

评论

1 楼 444065385 2013-12-05