JS 页面计时器示例代码
更新时间:2013年10月28日 18:10:15 作者:
计时器效果想必大家都见到过吧,其实使用js可以很轻松的实现,下面有个不错的示例,感兴趣的朋友可以参考下
复制代码 代码如下:
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<script type="text/javascript">
var c=0
var t
function timedCount()
{
document.getElementById('txt').value=c
c=c+1
t=setTimeout("timedCount()",1000)
}
function stopCount()
{
clearTimeout(t)
}
</script>
</head>
<body>
<form>
<input type="button" value="开始计时!" onClick="timedCount()">
<input type="text" id="txt">
<input type="button" value="停止计时!" onClick="stopCount()">
</form>
<p>请点击上面的“开始计时”按钮来启动计时器。输入框会一直进行计时,从 0 开始。点击“停止计时”按钮可以终止计时。</p>
<p>timedCount(),1000ms自己调自己。</p>
</body>
</html>
相关文章
JavaScript setTimeout与setTimeinterval使用案例详解
这篇文章主要介绍了JavaScript setTimeout与setTimeinterval使用案例详解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下2021-08-08javascript设计模式 – 迭代器模式原理与用法实例分析
这篇文章主要介绍了javascript设计模式 – 迭代器模式原理与用法,结合实例形式分析了javascript迭代器模式相关概念、原理、用法及操作注意事项,需要的朋友可以参考下2020-04-04'webpack-dev-server' 不是内部或外部命令也不是可运行的程序 或批处理文件的最
这篇文章主要介绍了'webpack-dev-server' 不是内部或外部命令也不是可运行的程序 或批处理文件的最新解决方法,文中给大家补充介绍了webpack-dev-server的介绍与用法,需要的朋友可以参考下2023-02-02
最新评论