js计时器

最新推荐文章于 2024-10-18 17:51:23 发布

washingtin

最新推荐文章于 2024-10-18 17:51:23 发布

阅读量89

点赞数

分类专栏： js计时器文章标签： javascript ViewUI

本文链接：https://blog.csdn.net/washingtin/article/details/84654041

版权

js计时器专栏收录该内容

1 篇文章 0 订阅

订阅专栏


<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />  
<script type="text/javascript">  
	var c=0;
	var t;
	function timedCount()  
	{  
		var temptextmin=document.getElementById('txt');

		hour = parseInt(c / 3600);// 小时数  
		min = parseInt(c / 60);// 分钟数  
		if(min>=60){
			min=min%60;
		}
		lastsecs = c % 60;
		if (hour < 10)
		{
			hour = '0' + hour;
		}
		if (min < 10)
		{
			min = '0' + min;
		}
		if (lastsecs < 10)
		{
			lastsecs = '0' + lastsecs;
		}

		temptextmin.value = hour + ":" + min + ":" + lastsecs;

		c=c+1;
		t=setTimeout("timedCount()",1000);
		document.getElementById('start').style.display = "none";
		document.getElementById('end').style.display = "";
	}  

	function stopCount()  
	{  
		clearTimeout(t);
		document.getElementById('start').style.display = "";     
		document.getElementById('end').style.display = "none";   
	}  
	function clearAll(){  
		c=0; 
		document.getElementById('txt').value=  "00:" +  "00:" + "00";
		clearTimeout(t);
		document.getElementById('start').style.display ="";     
		document.getElementById('end').style.display = "none";   
	}  
</script>  
</head>  

<body>  

<form>  
	<input type="text" id="txt" />  
	<input type="button" value="开始计时！" id="start" onClick="timedCount();" />  
	<input type="button" value="停止计时！" style="display: none" id="end" onClick="stopCount();" />  
	<input type="button" value="清除" onClick="clearAll();">  
</form>  

<p>请点击上面的“开始计时”按钮来启动计时器。输入框会一直进行计时，从 0 开始。点击“停止计时”按钮可以终止计时。</p>  

</body>  

</html>