zoukankan      html  css  js  c++  java
  • js中setInterval和setTimeout区别和用法

    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;
    $(function(){
    $("#btnReg").attr("disabled",true);
    intervalId = setInterval("countDown()",1000);
    });
    function countDown(){   
    if(leftSeconds <=0){
    $("#btnReg").val("submit");
    $("#btnReg").attr("disabled",false);
    clearInterval(intervalId);
    return;
    }else{
    leftSeconds--;
    $("#btnReg").val("请仔细阅读" + leftSeconds + "秒");
    }
    }

  • 相关阅读:
    🍖JS函数
    🍖JS流程控制
    🍖JS运算符介绍
    🍖JS数值类型与字符串类型的内置方法
    多态
    property装饰器
    封装
    组合
    继承&派生 属性查找
    继承与派生
  • 原文地址:https://www.cnblogs.com/luoyanli/p/2727556.html
Copyright © 2011-2022 走看看