首页 > 代码库 > 定时器的制作与清除

定时器的制作与清除

 1 <HTML> 2 <HEAD> 3 <META http-equiv="Content-Type" content="text/html; charset=gb2312"> 4 <TITLE>无标题文档</TITLE> 5 <STYLE type="text/css"> 6 <!-- 7 /*设置样式:无边框的文本框*/ 8 INPUT { 9     font-size: 20px;10     border-style:none ;11     background-color:#FF8B3B;12     color:#E7E5E5;13     }14 -->15 </STYLE>16 <SCRIPT language="javascript" type="text/javascript" >17 var id=null;18 function reloop(){19      var time = new Date( ); //获得当前时间20      //获得小时、分钟、秒21      var hour = time.getHours();  22      var minute = time.getMinutes();23      var second = time.getSeconds();24      if (minute < 10) //如果分钟只有1位,补0显示25        minute="0"+minute;26      if (second < 10) //如果秒数只有1位,补0显示27         second="0"+second;28     document.getElementById("t").value=hour+":"+minute+":"+second;29     id=setTimeout("reloop()",1000);30     31 }32 window.onload=function(){33     var btn=document.getElementById(btn); 34     btn.onclick=function(){35          if(this.value=="开始"){  36                   //使按钮文本变为停止  37                   this.value="停止"; 38                   this.innerHTML= "停止";39                   //设置定时器,每1s跳一次40                   id=window.setTimeout("reloop()",1000);    41           }else{  42                   //使按钮文本变为开始  43                   this.value="开始";44                   this.innerHTML="开始";45                   //取消定时  46                   window.clearTimeout(id);  47           } 48     }49     reloop();50 }51 </SCRIPT>52 53 </HEAD>54 55 <BODY>56 现在时间:<INPUT id="t" name="time" type="text" size="10">57 <button id="btn" value="停止">停止</button>58 </BODY>59 </HTML>
View Code