首页 > Web开发 > 详细

js计时器

时间:2015-09-30 12:56:54      阅读:228      评论:0      收藏:0      [点我收藏+]

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>计时器</title>
<script type="text/javascript">
var t=0;
var t1;
//定义$函数获取id
function $(id){
  return document.getElementById(id);
}
//开始计时
function timeStart(){
  hour = parseInt(t / 3600);// 时
  min = parseInt(t / 60);// 分
  if(min>=60){
    min = min % 60;
  }
  lastsecs = t % 60; //秒
  if(lastsecs<10){lastsecs = ‘0‘ + lastsecs;}
  if(min<10){min = ‘0‘ + min;}
  if(hour<10){hour = ‘0‘ + hour;}
  //在输入框显示计时
  $(‘txt‘).value = hour + ":" + min + ":" + lastsecs;
  t = t + 1;
  t1 = setTimeout(‘timeStart()‘,1000)
  $(‘start‘).style.display = "none";
  $(‘stop‘).style.display = "";
}
//停止计时
function timeStop(){
  clearTimeout(t1)
  $(‘start‘).style.display = "";
  $(‘stop‘).style.display = "none";
}
//清除
function clearAll(){
  t=0;
  $(‘txt‘).value= "00:" + "00:" + "00";
  clearTimeout(t1);
  $(‘start‘).style.display ="";
  $(‘stop‘).style.display = "none";
}
</script>
</head>
<body>
<p>点击“开始计时”按钮启动计时器开始进行计时,从 0 开始,点击“停止计时”按钮停止计时。</p>
<form>
<input type="text" id="txt" value="00:00:00" />
<input type="button" value="开始计时" id="start" onClick="timeStart()" />
<input type="button" value="停止计时" style="display:none" id="stop" onClick="timeStop()" />
<input type="button" value="清除" onClick="clearAll()" />
</form>
</body>
</html>

js计时器

原文:http://www.cnblogs.com/Sillynoob/p/4848642.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!