Javascript 中 setInterval 函数怎么用?


本文摘自PHP中文网,作者Guanhui,侵删。

在JavaScript中setInterval函数的作用是按照指定的周期时间来调用函数或计算表达,其语法为“setInterval(func,ms)”,返回值是一个ID,可以将这个ID传递给“clearInterval”函数来取消执行。

使用示例

你可以通过调用一个已命名的函数,每三秒(3000 毫秒)弹出 "Hello":

1

2

3

4

5

6

7

8

9

var myVar;

  

function myFunction() {

    myVar = setInterval(alertFunc, 3000);

}

  

function alertFunc() {

    alert("Hello!");

}

显示当前时间( setInterval() 方法会每秒执行一次函数,类似手表功能):

1

2

3

4

5

6

7

var myVar = setInterval(function(){ myTimer() }, 1000);

  

function myTimer() {

    var d = new Date();

    var t = d.toLocaleTimeString();

    document.getElementById("demo").innerHTML = t;

}

使用 clearInterval() 来停止 setInterval 的执行:

1

2

3

4

5

6

7

8

9

10

11

var myVar = setInterval(function(){ myTimer() }, 1000);

  

function myTimer() {

    var d = new Date();

    var t = d.toLocaleTimeString();

    document.getElementById("demo").innerHTML = t;

}

  

function myStopFunction() {

    clearInterval(myVar);

}

使用 setInterval() 和 clearInterval()来创建动态进度条:

1

2

3

4

5

6

7

8

9

10

11

12

13

function move() {

  var elem = document.getElementById("myBar");

  var width = 0;

  var id = setInterval(frame, 10);

  function frame() {

    if (width == 100) {

      clearInterval(id);

    } else {

      width++;

      elem.style.width = width + '%';

    }

  }

}

推荐教程:《JavaScript》

以上就是Javascript 中 setInterval 函数怎么用?的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

javascript怎么实现禁止缩放

如何实现炫酷的数字大屏

代码详解vue中key的作用示例

javascript怎么实现日期转换字符串

js绘制两个相交的矩形并且其中有一个包含透明度

javascript如何删除数组

javascript有哪些不同版本

一文了解javascript中合并和克隆对象的方法

javascript数组怎么求和

详细了解javascript中的延迟加载

更多相关阅读请进入《javascript》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...