Javascript中setTimeout,setInterval定时执行操作-百分百源码网

Javascript中setTimeout,setInterval定时执行操作

发布时间：01/15 来源：浏览：关键词：

在javascript中定时器功能我们会用到setTimeout,setInterval函数实现，下面小编来给大家介绍一下利用这两个函数实现定时操作吧。

今天在项目中遇到一个关于定时执行操作的问题。Javascript为定时操作提供了两个方法:

代码如下
1、timeId = setTimeout("function();",delaytime);

//timeId就是这个定时器的ID（后面会用到），

delaytime的单位是千分之一秒, millisecond。

代码如下
2、timeId = setInterval("function();",delaytime); //同上

这两个定时器的区别在：setTimeout()是在一段时间后执行指定的方法（称倒计定时器），而setInterval是每隔一段时间后执行指定的方法（称循环定时器）。

对于倒计定时器，加载后1秒后弹出对话框，演示代码：

倒计定时器，加载后1秒后弹出对话框，演示代码：

代码如下

timeId = setTimeout("alert('ok');",1000);

</script>

对于循环定时器：加载后每隔1秒后弹出对话框，演示代码：

代码如下
<script lang='javascript'> timeId = setInterval("alert('ok');",1000); </script>

既然上面提到了定时器ID，那么这个ID肯定就有他的用处，这个ID会在定时器执行的过程中当满足一定条件要关闭这个定时器时用到，对应的也提供了两个方法：

1、clearTimeout(timeId);

2、clearInterval(timeId);

现在你就可以在网站上尝试添加定时操作了,如果我们要实现不定时操作呢，

使用setTimeout(callback, delay, [arg], [...])进行在设定的时间间隔后执行指定函数。参数类似于setInterval函数。同样返回一个timeoutId，用于调用clearTimeout(timeoutId)已中途终止以阻止本此触发。

因此，我们可以利用setTimeout这一特点，实现不定时执行某一操作的功能。

代码如下

        var cruiseNodes = [1,2,1,3];
        var cruiseNO = 0;

        startPlayCruise();

        function startPlayCruise() {
            if (cruiseNO >= cruiseNodes.length) return;

            cruiseDelay = parseFloat(cruiseNodes[cruiseNO])*1000;

            alert(cruiseDelay);

cruiseNO++;

setTimeout(startPlayCruise, cruiseDelay);
}

传递参数给callback函数的setTimeout函数调用的写法为：

代码如下
setTimeout(myFunction, myTimeout, parameter);

示例代码如下：

代码如下

    var cruiseNodes = [1,2,1,3];
    var cruiseNO = 0;

    startPlayCruise(cruiseNO);

    function startPlayCruise(number) {
        if (cruiseNO >= cruiseNodes.length) return;

        cruiseDelay = parseFloat(cruiseNodes[cruiseNO])*1000;

        // 将序号作为setTimeout函数用于startPlayCruise函数的输入参数，并在此显示
        alert(number);

        cruiseNO++;

        setTimeout(startPlayCruise,cruiseDelay,cruiseNO);
        // 或者使用闭包，如下所示：
        // setTimeout(function()(startPlayCruise(cruiseNO)),cruiseDelay);
    }