当前位置:首页 > 编程教程 > javascript技术文章 > JS使用setInterval实现的简单计时器功能示例

JS使用setInterval实现计时器功能

  • 发布时间:
  • 作者:码农之家
  • 点击:78

这篇文章主要知识点是关于JS、setInterval、计时器、的内容,如果大家想对相关知识点有系统深入的学习,可以参阅以下电子书

JavaScript DOM编程艺术
  • 类型:JavaScript大小:109.2 MB格式:PDF作者:基思(Keith,J.),(加)桑布尔斯
立即下载

JS使用setInterval实现的简单计时器功能示例

本文实例讲述了JS使用setInterval实现的简单计时器功能。分享给大家供大家参考,具体如下:

使用setInterval实现计时,并且满60秒向分钟进一,满60分钟向小时进一。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>www.jb51.net JS计时器</title>
    <script>
      window.onload = function(){
      var mm = 0;
      var ss = 0;
      var str = '';
      var timer = setInterval(function(){
      str = "";
      if(++ss==60)
      {
      if(++mm==60)
      {
      mm=0;
      }
      ss=0;
      }
      str+=mm<10?"0"+mm:mm;
      str+=":";
      str+=ss<10?"0"+ss:ss;
      document.getElementById("d").innerHTML = str;
      },1000);
      };
    </script>
  </head>
  <body>
  <div id="d"></div>
  </body>
</html>

运行结果:

JS使用setInterval实现的简单计时器功能示例

希望本文所述对大家JavaScript程序设计有所帮助。

以上就是本次给大家分享的关于java的全部知识点内容总结,大家还可以在下方相关文章里找到相关文章进一步学习,感谢大家的阅读和支持。

javascript 相关电子书
学习笔记
网友NO.411538

JS实现定时任务每隔N秒请求后台setInterval定时和ajax请求问题

先看下面一段代码: DiGui = function (param) { $.ajax({ success: function (returnValue) { window.setInterval("fnSetMarkPoint()", 5000); }}); 调用DiGui()方法后 问题: 每隔0.1秒创建一个setInterval,成一个树形的方式循环创建setInterval,直到页面崩溃 解决思路: 保证setInterval对象只创建一次 实现方案: 定一个布尔变量进行判断 var status= true; var status = true;DiGui = function (param) { $.ajax({ success: function (returnValue) { if (status) { status= false; window.setInterval("DiGui()", 5000); } } }); 总结 以上所述是小编给大家介绍的JS实现定时任务每隔N秒请求后台setInterval定时和ajax请求问题,希望对大家有所帮助如果大家有任何疑问欢迎给我留言,小编会及时回复大家的! ……

网友NO.225843

JS SetInterval 代码实现页面轮询

概念介绍 setInterval 是一个实现定时调用的函数,可按照指定的周期(以毫秒计)来调用函数或计算表达式。setInterval方法会不停地调用函数,直到 clearInterval 被调用或窗口被关闭。 由 setInterval 返回的ID值可用作 clearInterval 方法的参数。 提示: 1000 毫秒= 1 秒。 flash用法(来自百度百科) setInterval 动作的作用是在播放动画的时,每隔一定时间就调用函数,方法或对象。可以使用本动作更新来自数据库的变量或更新时间显示。setInterval动作的语法格式如下: setInterval(function,interval[,arg1,arg2,......argn])setInterval(object,methodName,interval[,arg1,arg2,.....argn]) 语法 实现代码(监测支付状态) $(document).ready(function(){ var timer = setInterval(function(){ajax_wx_pay_status(timer)},3000); }); function ajax_wx_pay_status(timer) { var toUrl = "{:U('Order/ajax_get_pay_status')}"; var orderUrl = "{:U('Member/myorder')}"; if ($("……

网友NO.699125

快速掌握Node.js中setTimeout和setInterval的使用方法

Node.js和js一样也有计时器,超时计时器、间隔计时器、及时计时器,它们以及process.nextTick(callback)函数来实现事件调度。今天先学下setTimeout和setInterval的使用。 一、setTimeout超时计时器(和GCD中的after类似) 在node.js中可以使用node.js内置的setTimeout(callback,delayMillSeconds,[args])方法。当调用setTime()时回调函数会在delayMillSeconds后 执行.setTime() 会返回一个定时器对象ID,可以在delayMillSeconds到期前将ID传给clearTimeout(timeoutId)来取消。 function myfunc(){ console.log("myfunc");};var mytimeout=setTimeout(myfunc,1000);clearTimeout(mytimeout); "C:\Program Files (x86)\JetBrains\WebStorm 11.0.3\bin\runnerw.exe" F:\nodejs\node.exe timer.jsProcess finished with exit code 0 如果将clearTimeout(mytimeout);这行注释之后可以看到是会执行myfunc()。 "C:\Program Files (x86)\JetBrains\WebStorm 11.0.3\bin\runnerw.exe" F:\nodejs\node.exe timer.jsmyfuncProcess finished with exit c……

网友NO.481734

JS中SetTimeout和SetInterval使用初探

一切尽在代码截图中,愿意和大家一起成长!可以喷,毕竟是菜鸟! 好了,废话不多说了,看具体实例代码吧! !DOCTYPE html html lang="en" head meta charset="UTF-8" titleTitle/title /head body div class="wraper"/div div class="wraper1"abcd123441223432 /div button onclick="clearIt=window.clearInterval(clearIt)" Stop/button script window.onload = function () { $('.wraper').html('12343242342') setTimeout(function () { $('.wraper').hide(); setTimeout(function () { $('.wraper1')[0].style.backgroundColor = 'red'; console.log(new Date(),"in"); },20000); console.log(new Date(),"out"); },10000); } var clearIt=self.setInterval("setIntervalTest()",1000); function setIntervalTest () { console.log('++++'); } /script script type="text/javascript" src="jquery/jquery-min.js"/script /body /html 补充:下面看下setTimeout和setInterval的相同处及区别介绍 setTimeout和setInterval的相同处 setTimeout和setInteval 都是window对象的定时方法,它们……

<
1
>

Copyright 2018-2020 www.xz577.com 码农之家

版权投诉 / 书籍推广 / 赞助:520161757@qq.com