js定时函数

1.时间表
<html>
    <head>
        <script language="javascript">
            function showtime() {
                var time = new Date();
                var hour = time.getHours();
                var minute = time.getMinutes();
                var seconds = time.getSeconds();
                document.getElementById("show").innerHTML=hour+ ":" + minute + ":" + seconds;
               // var timeId = setTimeout(showtime,1000);//倒计时定时器,每隔一秒后执行   clearTimeout(timeId ) 清除已设置的setTimeout对象
            }
           
           //setTimeout(showtime,1000);//放在这里只会执行一次 动态执行多个函数之间用";"
          var timeId= setInterval(showtime,1000); //循环定时器  clearInterval(timeId) 清除已设置的setInterval对象
        </script>
       
    </head>
    <body onload="showtime()">
        <form>
            <div id='show'></div>
        </form>
    </body>
</html>

2.计时器
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
</head>
<body>
<form>
计时显示:<input type="text" value="0" name="txt1"/>
<input type="button" value="开始" name="btnStart"/>
<input type="button" value="重置" name="btnReset"/>
</form>
</body>
</html>
<script language="JavaScript" type="text/javascript">
<!--
//获取表单中的表单域
var txt=document.forms[0].elements["txt1"];
var btnStart=document.forms[0].elements["btnStart"];
var btnReset=document.forms[0].elements["btnReset"]
//定义定时器的id
var id;
//每10毫秒该值增加1
var seed=0; 
btnStart.onclick=function(){
      //根据按钮文本来判断当前操作
      if(this.value=="开始"){
              //使按钮文本变为停止
              this.value="停止";
              //使重置按钮不可用
              btnReset.disabled=true;
              //设置定时器,每0.01s跳一次
              id=window.setInterval(tip,10);
      }else{
              //使按钮文本变为开始
              this.value="开始";
              //使重置按钮可用
              btnReset.disabled=false;
              //取消定时
              window.clearInterval(id);
      }
}

//重置按钮
btnReset.onclick=function(){
     seed=0;
     document.forms[0].elements["txt1"].value=0;
}
//让秒表跳一格
function tip(){
      seed++;
      txt.value=seed/100;
}
//-->
</script>


你可能感兴趣的:(html)