zoukankan      html  css  js  c++  java
  • (DOM)网页中的定时器功能

    在网页中有四个定时功能函数:

    setinterval("要执行的函数",时间间隔),返回值为定时器的ID.

    clearinterval(定时器的ID),关闭定时器

    以上的两个函数表示每隔多长时间就执行一次。

    settimeout("要执行的函数",过期的时间),返回值为过期定时器的ID

    cleartimeout(过期定时器的ID),关闭过期定时器

    在调用setinterval时一定要记得关闭相应的ID,每调用一次就产生一个定时器。

    settimeout是表示过多长时间后才能执行它指定的函数,和setinterval不一样,它只执行一次。

    时间间隔的单位为微秒,即1秒=1000微秒

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script type="text/javascript">
            var intervalID,timeoutID;
            var i = 0;
            function startInterval() {
                intervalID = setInterval(getthevalue, 500);//每0.5秒就执行一次getthevalue
          }
    
          function getthevalue() {
              document.getElementById("txt").value = i;
              i++;
              if (i >= 100) {
                  clearInterval(intervalID); //停止计时器
                  document.getElementById("btn").value="计时结束"
              }
          }
    
          function begintimeout() {
              timeoutID = setTimeout(showdlg, 10000); //10秒后执行一次showdlg函数
          }
          function showdlg() {
              document.getElementById("txt").value = i;
              i++;
              if (i >= 100) {
                  clearTimeout(timeoutID); //停止过期计时器
                  document.getElementById("timeout").value = "计时结束";
              }
          }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
        <input type="text" id="txt" />
        <input type="button" id="btn" value="计时开始" onclick="startInterval();" />
        <input type="button" id="timeout" value="执行" onclick="begintimeout();"/>
        </div>
        </form>
    </body>
    </html>
  • 相关阅读:
    面向对象--接口的实际应用--制定标准
    iconv命令 gbk 转 UTF-8
    map,list
    springMVC配置(XML配置详解)
    关于git-Git 分支管理和冲突解决
    使用Intellij idea开发
    Centos7.2 Install subversion server
    Nginx 多域名配置
    Nginx 解析PHP的原理 | CGI、FastCGI及php-fpm的关系
    Centos7 Yum安装 PHP5.5,5.6,7.0
  • 原文地址:https://www.cnblogs.com/yagzh2000/p/3088271.html
Copyright © 2011-2022 走看看